#mainimg { background-image: url("../img/access/bg_mainimg01_sp.png"); } @media screen and (min-width: 600px) { #mainimg { background-image: url("../img/access/bg_mainimg01_pc.png"); } } #intro { box-sizing: border-box; padding: 28px 0 43px; } #intro .img { margin-bottom: 10px; background: #fff; } #intro .list li { display: table; width: 100%; } #intro .list li .tit { display: table-cell; width: 72px; } #intro .list li .txt { display: table-cell; } @media screen and (min-width: 600px) { #intro { padding: 25px 0 93px; } #intro .img { margin-bottom: 15px; text-align: center; } #intro .list { padding-left: 76px; } #intro .list li .tit { width: 85px; } } #mapWrap { box-sizing: border-box; padding: 37px 0 50px; background-color: #e8f3f4; } #mapWrap .tit03 { margin-bottom: 20px; } #mapWrap .txt { padding-bottom: 23px; } #mapWrap .list .gmap { margin-bottom: 20px; } #mapWrap .list .gmap iframe { width: 100%; height: 230px; } @media screen and (min-width: 600px) { #mapWrap { padding: 80px 0; } #mapWrap .tit03 { margin-bottom: 27px; } #mapWrap .txt { padding-bottom: 39px; text-align: center; } #mapWrap .list .gmap { float: left; width: 530px; margin-bottom: 20px; } #mapWrap .list .gmap iframe { width: 100%; height: 353px; } #mapWrap .list .map { float: right; width: 530px; } } #tour { box-sizing: border-box; padding: 35px 0 0; } #tour .inner01 { padding-top: 16px; padding-bottom: 50px; } #tour .inner01 .sub { position: relative; margin-bottom: 5px; padding-left: 32px; color: #b98a4b; font-size: 1.5rem; } #tour .inner01 .sub:before { position: absolute; top: 15px; left: 0; width: 22px; height: 1px; background: #b98a4b; content: ""; } #tour .inner01 .topTit { line-height: 1.59091; margin-bottom: 14px; font-size: 2.2rem; } #tour .inner01 .txt { padding-bottom: 9px; } #tour .box { position: relative; } #tour .box .inner { padding: 0 15px; } #tour .box .inner .inBox { margin: -35px 0 32px; } #tour .box .inner .inBox .boxInner { padding: 15px 15px 22px; } #tour .box .inner .sub { margin-bottom: 9px; text-align: center; } #tour .box .inner .sub span { display: inline-block; position: relative; color: #b98a4b; font-size: 1.6rem; } #tour .box .inner .sub span:before { position: absolute; top: 16px; left: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } #tour .box .inner .sub span:after { position: absolute; top: 16px; right: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } @media screen and (min-width: 600px) { #tour .box .inner .sub span { font-size: 2.4rem; } #tour .box .inner .sub span:before { top: 27px; left: -45px; width: 30px; } #tour .box .inner .sub span:after { top: 27px; right: -45px; width: 30px; } } #tour .box .inner .inTit { line-height: 1.4; margin-bottom: 21px; font-size: 2.2rem; } #tour .box .inner .inTit span { line-height: 1.4; } #tour .box .inner .midTit { margin: 0 -15px 20px; } #tour .box01 .list , #tour .box02 .list , #tour .box03 .list { padding-bottom: 18px; } #tour .box01 .list li , #tour .box02 .list li , #tour .box03 .list li { padding-bottom: 28px; } #tour .box01 .list li .img , #tour .box02 .list li .img , #tour .box03 .list li .img { margin-bottom: 13px; } #tour .box01 .list li .titWrap .tit , #tour .box02 .list li .titWrap .tit , #tour .box03 .list li .titWrap .tit { line-height: 1.38889; margin-bottom: 11px; padding-bottom: 11px; border-bottom: 1px solid #63c7cd; font-weight: 500; font-size: 1.8rem; } #tour .box01 { padding: 50px 0 0; } #tour .box01 .btmInner { padding-bottom: 16px; background-color: #e8f3f4; } #tour .box01 .topImg { text-align: center; } #tour .box01 .slideTop { box-sizing: border-box; } @media screen and (min-width: 600px) { #tour .box01 .slideTop { width: 1100px; margin: 0 auto; } } #tour .box02 .sub , #tour .box03 .sub { margin-bottom: 9px; text-align: center; } #tour .box02 .sub span , #tour .box03 .sub span { display: inline-block; position: relative; color: #b98a4b; font-size: 1.6rem; } #tour .box02 .sub span:before , #tour .box03 .sub span:before { position: absolute; top: 16px; left: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } #tour .box02 .sub span:after , #tour .box03 .sub span:after { position: absolute; top: 16px; right: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } @media screen and (min-width: 600px) { #tour .box02 .sub span , #tour .box03 .sub span { font-size: 2.4rem; } #tour .box02 .sub span:before , #tour .box03 .sub span:before { top: 27px; left: -45px; width: 30px; } #tour .box02 .sub span:after , #tour .box03 .sub span:after { top: 27px; right: -45px; width: 30px; } } #tour .box02 .topImg , #tour .box03 .topImg { margin-bottom: 14px; text-align: center; } #tour .box02 .inner .topTxt , #tour .box03 .inner .topTxt { padding-bottom: 35px; } #tour .box02 .inner .list li , #tour .box03 .inner .list li { padding-bottom: 25px; } #tour .box02 { padding: 40px 0 0; } #tour .box02 .topImg { box-sizing: border-box; } @media screen and (min-width: 600px) { #tour .box02 .topImg { width: 1100px; margin: 0 auto; } } #tour .box02 .inTit { margin-bottom: 25px; } #tour .box03 { padding: 42px 0 0; background-color: #e8f3f4; } #tour .box04 { padding: 48px 0 0; } #tour .box04 .inTit { margin-bottom: 25px; } @media screen and (max-width: 599px) { #tour .box04 .sub { position: relative; margin-bottom: 5px; margin-bottom: 9px; color: #b98a4b; font-size: 1.5rem; text-align: center; } #tour .box04 .sub span { display: inline-block; position: relative; color: #b98a4b; font-size: 1.6rem; } #tour .box04 .sub span:before { position: absolute; top: 16px; left: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } #tour .box04 .sub span:after { position: absolute; top: 16px; right: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } } @media screen and (max-width: 599px) and (min-width: 600px) { #tour .box04 .sub span { font-size: 2.4rem; } #tour .box04 .sub span:before { top: 27px; left: -45px; width: 30px; } #tour .box04 .sub span:after { top: 27px; right: -45px; width: 30px; } } #tour .box04 .inner .imgTop { margin-bottom: 8px; } #tour .box04 .inner .list li { float: right; width: 49%; margin-bottom: 8px; } #tour .box04 .inner .list li:nth-child(2n+1) { float: left; } #tour .box04 .inner .txt { padding: 5px 0 50px; } #tour .box05 { padding: 42px 0 55px; background-color: #e8f3f4; } #tour .box05 .inner .list li .img { margin-bottom: 10px; } #tour .box05 .inner .list li .txt { padding-bottom: 24px; } @media screen and (min-width: 600px) { #tour { padding: 79px 0 0; } #tour .tit05 { margin-bottom: 70px; } #tour .inner01 { padding-top: 16px; padding-bottom: 150px; background: none; } #tour .inner01:after { bottom: 50px; height: 300px; } #tour .inner01 .sub { margin-top: 7px; padding-left: 60px; font-size: 2.4rem; } #tour .inner01 .sub:before { top: 26px; width: 45px; } #tour .inner01 .topTit { line-height: 1.42105; margin-bottom: 24px; font-size: 3.8rem; } #tour .inner01 .txt { padding-bottom: 9px; letter-spacing: .16rem; } #tour .box { position: relative; } #tour .box .inner { padding: 0 15px; } #tour .box .inner .inBox { width: 1100px; margin: -98px auto 80px; } #tour .box .inner .inBox .boxInner { padding: 225px 70px 52px; } #tour .box .inner .inBox .txt { letter-spacing: .128rem; } #tour .box .inner .sub { position: absolute; top: 48px; right: 0; left: 0; margin: 0 auto; margin-bottom: 9px; text-align: center; text-align: center; } #tour .box .inner .sub span { display: inline-block; position: relative; color: #b98a4b; font-size: 1.6rem; } #tour .box .inner .sub span:before { position: absolute; top: 16px; left: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } #tour .box .inner .sub span:after { position: absolute; top: 16px; right: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } } @media screen and (min-width: 600px) and (min-width: 600px) { #tour .box .inner .sub span { font-size: 2.4rem; } #tour .box .inner .sub span:before { top: 27px; left: -45px; width: 30px; } #tour .box .inner .sub span:after { top: 27px; right: -45px; width: 30px; } } @media screen and (min-width: 600px) { #tour .box .inner .inTit { position: absolute; top: 109px; right: 0; left: 0; line-height: 1.42105; margin: 0 auto; font-size: 2.8rem; text-align: center; } #tour .box .inner .inTit span { line-height: 1.4; font-size: 4.0rem; } #tour .box .inner .midTit { width: 1100px; margin: 0 auto 40px; } #tour .box01 .list , #tour .box02 .list , #tour .box03 .list { width: 1100px; margin: 0 auto 40px; padding-bottom: 18px; } #tour .box03 .list { margin-bottom: 75px; } #tour .box01 .list li , #tour .box02 .list li , #tour .box03 .list li { padding-bottom: 28px; } #tour .box01 .list li .img , #tour .box02 .list li .img , #tour .box03 .list li .img { float: left; margin-bottom: 13px; } #tour .box01 .list li .titWrap , #tour .box02 .list li .titWrap , #tour .box03 .list li .titWrap { float: right; width: 510px; padding-top: 25px; } #tour .box01 .list li .titWrap .tit , #tour .box02 .list li .titWrap .tit , #tour .box03 .list li .titWrap .tit { line-height: 1.38889; margin-bottom: 21px; padding-bottom: 28px; font-size: 2.6rem; } #tour .box01 .list li .titWrap .txt , #tour .box02 .list li .titWrap .txt , #tour .box03 .list li .titWrap .txt { letter-spacing: .13rem; } #tour .box01 { padding: 50px 0 0; } #tour .box01 .btmInner { padding-bottom: 18px; } #tour .box02 .sub , #tour .box03 .sub { margin-bottom: 9px; text-align: center; } #tour .box02 .sub span , #tour .box03 .sub span { display: inline-block; position: relative; color: #b98a4b; font-size: 1.6rem; } #tour .box02 .sub span:before , #tour .box03 .sub span:before { position: absolute; top: 16px; left: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } #tour .box02 .sub span:after , #tour .box03 .sub span:after { position: absolute; top: 16px; right: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } } @media screen and (min-width: 600px) and (min-width: 600px) { #tour .box02 .sub span , #tour .box03 .sub span { font-size: 2.4rem; } #tour .box02 .sub span:before , #tour .box03 .sub span:before { top: 27px; left: -45px; width: 30px; } #tour .box02 .sub span:after , #tour .box03 .sub span:after { top: 27px; right: -45px; width: 30px; } } @media screen and (min-width: 600px) { #tour .box02 .topImg , #tour .box03 .topImg { margin-bottom: 14px; } #tour .box02 .inner .topTxt , #tour .box03 .inner .topTxt { width: 1100px; margin: 0 auto; padding: 45px 0 60px; letter-spacing: .13rem; } #tour .box02 .inner .list li , #tour .box03 .inner .list li { padding-bottom: 25px; } #tour .box02 .inTit , #tour .box03 .inTit , #tour .box04 .inTit , #tour .box05 .inTit { margin-bottom: 75px; font-size: 2.8rem; } #tour .box02 .inTit span , #tour .box03 .inTit span , #tour .box04 .inTit span , #tour .box05 .inTit span { line-height: 1.4; font-size: 4rem; } #tour .box02 { padding: 100px 0 20px; } #tour .box03 { padding: 100px 0 10px; } #tour .box03 .inTit { margin-bottom: 0; } #tour .box03 .inner .topTxt { padding: 27px 0 60px; } #tour .box04 { padding: 88px 0 10px; } #tour .box04 .inTit { margin-bottom: 45px; } #tour .box04 .sub { position: relative; margin-top: 7px; margin-bottom: 5px; color: #b98a4b; font-size: 2.4rem; text-align: center; } #tour .box04 .sub:before { top: 26px; width: 45px; } #tour .box04 .sub span { display: inline-block; position: relative; color: #b98a4b; font-size: 1.6rem; } #tour .box04 .sub span:before { position: absolute; top: 16px; left: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } #tour .box04 .sub span:after { position: absolute; top: 16px; right: -27px; width: 16px; height: 1px; background: #b98a4b; content: ""; } } @media screen and (min-width: 600px) and (min-width: 600px) { #tour .box04 .sub span { font-size: 2.4rem; } #tour .box04 .sub span:before { top: 27px; left: -45px; width: 30px; } #tour .box04 .sub span:after { top: 27px; right: -45px; width: 30px; } } @media screen and (min-width: 600px) { #tour .box04 .inner { width: 1100px; margin: 0 auto; padding: 0; } #tour .box04 .inner .imgTop { margin-bottom: 30px; } #tour .box04 .inner .list li { float: left; width: 350px; margin: 0 0 0 25px; } #tour .box04 .inner .list li:nth-child(2n+1) { float: left; } #tour .box04 .inner .list li:first-child { margin-left: 0; } #tour .box04 .inner .txt { padding: 29px 0 84px; letter-spacing: .13rem; } #tour .box05 { padding: 88px 0 130px; } #tour .box05 .inner { width: 1100px; margin: 0 auto; padding: 0; } #tour .box05 .inner .sub , #tour .box05 .inner .inTit { position: relative; top: auto; margin-bottom: 10px; } #tour .box05 .inner .inTit { margin-bottom: 40px; } #tour .box05 .inner .list { padding: 6px 0 0; } #tour .box05 .inner .list li { float: left; width: 335px; margin: 0 0 0 47px; } #tour .box05 .inner .list li:first-child { margin-left: 0; } #tour .box05 .inner .list li .img { margin-bottom: 22px; } #tour .box05 .inner .list li .txt { padding-bottom: 24px; } }