@charset "Shift_JIS";
/*
 ------------------------------
 ��(C)ANA /anamail/omiyage/hokkaido_sapporo/ CSS
 ��Version: 1.0
 ��creation date: 18/04/2016
 ��last update: 18/04/2016

 ��INDEX
	01 Public, Common
	02 #EyeCatch
	03 #section1
	04 #section2
	05 #section3
	06 #section4
	07 #section5
	08 #ContentFooterBanner
 ----------------------------- */

body {
  width: 100%;
  margin: 0;
}
img {
  height: auto;
}

/* ------------------------------
	01 Public , Common
 ----------------------------- */
#DomTourContainer {
  width: 100%;
}
#MainContents {
  background: #ffe4e9;
  font-size: 14px;
  line-height: 1.5rem;
  font-family: "�q���M�m�p�S Pro W3", "Hiragino Kaku Gothic Pro", "���C���I", Meiryo, Osaka, "�l�r �o�S�V�b�N", "MS PGothic", sans-serif;
  text-align: center;
}
.Wrap, .Sec {
  width: 950px;
  padding: 0;
  margin: 0 auto 20px auto;
  text-align: center;
}
.SectionTitle {
  margin: 0 auto 5px;
  display: block;
}
.ItemName {
  margin-bottom: 10px;
  text-align: right;
  padding-right: 5px;/*	text-align:center;*/
}
.ItemName img {
  height: auto;
  padding: 0 20px;
}
.Description {
  line-height: 25px;
  margin-bottom: 30px;
  text-align: left;
  font-size: 14px;
}
.Description_1 {
  line-height: 25px;
  margin-bottom: 30px;
  text-align: left;
  font-size: 14px;
  padding: 0 5px 0 30px;
}
.ItemName_1 {
  height: auto;
  padding: 0 0 0 30px;
}
/*--------------------------
	��float
---------------------------- */
.LeftSide {
  float: left;
  position: relative;
}
.RightSide {
  float: right;
  position: relative;
}
/*--------------------------
	��clearfix
---------------------------- */
.cf:before, .cf:after {
  content: "";
  display: block;
  overflow: hidden;
}
.cf:after {
  clear: both;
}
/* ------------------------------
	01 #EyeCatch
 ----------------------------- */
#EyeCatch {
  height: auto;
  position: relative;
  width: 100%;
  min-width: 950px;
}
#EyeCatch .main_images {
  width: 100%;
}
#EyeCatch .main_images .logo {
  display: block;
  position: absolute;
  top: 1.5%;
  left: 1.45%;
}
#EyeCatch .main_images .slice_image img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
  display: block;
}
#EyeCatch .text_wrap {
  position: absolute;
  top: 12%;
  width: 100%;
  left: 0;
}
#EyeCatch .text_wrap .title, #EyeCatch .text_wrap .text , #EyeCatch .text_wrap .area_title {
  width: 40%;
  display: block;
  margin: 0 auto 1%;
}
#EyeCatch .text_wrap .TargetMap {
  width: 40%;
  position: absolute;
  top: 33%;
  right: 12.5%;
}
  
#EyeCatch .text_wrap .title img, #EyeCatch .text_wrap .text img {
  width: 70%;
  height: auto;
}
#EyeCatch .text_wrap .area_title img {
  width: 70%;
  height: auto;
  margin: 7% 0 0;
}
#EyeCatch .text_wrap .TargetMap img {
  height: auto;
}

@media screen and (max-width: 1300px) {
  #EyeCatch .text_wrap .TargetMap {
    width: 38%;
    position: absolute;
    top: 46%;
    right: 16%;
  }
  #EyeCatch .text_wrap .TargetMap img {
    width: 60%;
    height: auto;
  }
}

@media screen and (min-width: 1450px) {
  #EyeCatch .text_wrap .title, #EyeCatch .text_wrap .text, #EyeCatch .text_wrap .area_title, #EyeCatch .text_wrap .TargetMap {
    /*width: 615px;*/
  }
  #EyeCatch .text_wrap .TargetMap {
    top: 40%;
  }
}
/* ------------------------------
	02 #PickUp
 ----------------------------- */
#PickUp.Wrap {
  width: 100%;
  background: #eaf7ff;
  padding: 95px 0 75px;
  margin: 0;
}
#PickUp .InnerContents {
  width: 950px;
  margin: 0 auto;
  height: auto;
  text-align: left;
}
#PickUp .LeftSide {
  width: 444px;
  padding-left: 25px;
}
#PickUp .RightSide {
  width: 475px;
  text-align: right;
}
#PickUp h3 {
  margin-top: 0;
}
#PickUp .Comment {
  margin: 20px 0 0;
}

/* ------------------------------
	03 #Section1
 ----------------------------- */
#Section1.Sec {
  width: 950px;
  padding-top: 95px;
  margin-bottom: 100px;
}
#Section1 .InnerContents {
  position: relative;
}
#Section1 .SectionTitle {
  margin: 0 auto 15px;
}
#Section1 .LeftSide {
  width: 440px;
  position: relative;
  top: 10px;
  left: 25px;
}
#Section1 .RightSide {
  width: 475px;
}
#Section1 .image_01 {
  margin-top: 0;
  position: relative;
  top: 30px;
}
#Section1 .image_02 {
  display: block;
  margin: 0 auto 15px;
}
#Section1 .Description {
  margin-bottom: 10px;
}

/* ------------------------------
	04 #Section2
 ----------------------------- */
 #Section2.Sec {
  width: 950px;
  margin-bottom: 80px;
}
#Section2 .InnerContents {
  position: relative;
}
#Section2 .SectionTitle {
  margin: 0 auto 15px;
}
#Section2 .LeftSide {
  width: 475px;
}
#Section2 .RightSide {
  width: 440px;
  position: relative;
  top: 10px;
  right: 25px;
}
#Section2 .image_01 {
  margin-top: 0;
  position: relative;
  top: 25px;
  left: -40px;
}
#Section2 .image_02 {
  display: block;
  margin: 0 auto 15px;
}
#Section2 .Description {
  margin-bottom: 0;
}

/* ------------------------------
	05 #Section3
 ----------------------------- */

#Section3.Sec {
  width: 950px;
  margin-bottom: 110px;
}
#Section3 .InnerContents {
  position: relative;
}
#Section3 .SectionTitle {
  margin: 0 auto 15px;
}
#Section3 .LeftSide {
  width: 440px;
  position: relative;
  top: 10px;
  left: 25px;
}
#Section3 .RightSide {
  width: 475px;
}
#Section3 .image_01 {
  margin-top: 0;
  position: relative;
  top: 35px;
}
#Section3 .image_02 {
  display: block;
  margin: 0 auto 10px;
}
#Section3 .Description {
  margin-bottom: 10px;
}

/* ------------------------------
	06 #Section4
 ----------------------------- */
#Section4.Sec {
  width: 950px;
  margin-bottom: 150px;
}
#Section4 .InnerContents {
  position: relative;
}
#Section4 .SectionTitle {
  margin: 0 auto 15px;
}
#Section4 .LeftSide {
  width: 475px;
}
#Section4 .RightSide {
  width: 440px;
  position: relative;
  right: 25px;
}
#Section4 .image_01 {
  margin-top: 0;
  position: relative;
  top: 35px;
  left: -40px;
}
#Section4 .image_02 {
  display: block;
  margin: 10px auto 15px;
}
#Section4 .Description {
  margin-bottom: 10px;
}

/* ------------------------------
	07 #Section5
 ----------------------------- */
#Section5.Sec {
  width: 950px;
  margin-bottom: 100px;
}
#Section5 .InnerContents {
  position: relative;
}
#Section5 .SectionTitle {
  margin: 0 auto 10px;
}
#Section5 .LeftSide {
  width: 440px;
  position: relative;
  top: 40px;
  left: 25px;
}
#Section5 .RightSide {
  width: 475px;
}
#Section5 .image_01 {
  margin-top: 0;
  position: relative;
  top: 0;
}
#Section5 .image_02 {
  display: block;
  margin: 0 auto 15px;
}
#Section5 .Description {
  margin-bottom: 35px;
}
#Section5 .SectionTitleNote {
  text-align: right;
  line-height: 1.5;
  margin: 10px 0 0;
}

/* ------------------------------
	08 #ContentFooterBanner
 ----------------------------- */
#ContentFooterBanner {
  margin: 0 auto 30px;
}
#ContentFooterBanner .ImgTitle {
  display: block;
  margin: 0 auto 10px;
}
#ContentFooterBanner .Btn {
  display: block;
  margin: 0 auto 10px;
  text-align: center;
  cursor: pointer;
}
.other-links h4 {
  text-align: center;
  margin: 0 auto 50px;
}
.other-links ul {
  margin-bottom: 30px;
}
.other-links ul li {
  display: inline-block;
}
.other-links ul li a {
  display: inline-block;
}
.other-links ul li a:hover {
  opacity: 0.85;
}
.other-links ul li.leftList {
  padding-right: 13px;
}
.other-links ul li.rightList {
  padding: 0;
}
.Survenia h4.SurveniaTitle {
  padding: 30px 0 20px 0;
  text-align: center;
}
.Survenia {
  background: url(../image/bg_frame.png) center top no-repeat;
  width: 950px;
  height: 222px;
  margin: 50px auto 40px;
}
.Survenia .cf {
  width: 885px;
  margin: auto;
}
.Survenia .cf .LeftSide {
  width: 370px;
  text-align: left;
  padding-top: 18px;
  letter-spacing: 2px;
  font-size: initial;
  line-height: initial;
}
.Survenia .LeftSide img {
  float: left;
  margin: 10px 10px 0 0;
}
.Survenia .LeftSide p {
  float: left;
  width: 60%;
  font-size: 14px;
  line-height: 1.5em;
}
.Survenia .cf .RightSide {
  width: 485px;
  border-left: 1px solid #21ade5;
  padding: 11px 0 11px 20px;
}
.anafasta {
  width: 100%;
  height: auto;
}
.Survenia a:hover {
  opacity: 0.85;
}
.backnumber_btn {
  margin: 0 0 37px 0;
}
/* ------------------------------
	09 #SnsIcon
 ----------------------------- */
#SnsIcon {
}
#SnsIcon ul {
  width: 82px;
  margin: 0 auto;
}
#SnsIcon ul li {
  margin-right: 10px;
  float: left;
  width: 36px;
}
#SnsIcon ul li a {
}
#SnsIcon ul li a img {
}
#SnsIcon ul li.right_icon {
  margin-right: 0 !important;
}
/* ------------------------------
	10 #LastSection
 ----------------------------- */
.LastSection {
  background: #b7dbff;
}
.LastSection .InnerContents {
  background: url(../image/bg_pattern_footer.png) repeat-x left top;
  padding: 100px 45px 30px;
}
#Section4 .CommentWrap {
  top: 425px;
}