@charset "utf-8";

/* Common */
body.scrollFixed{position:fixed; width:100%; overflow-y:scroll;}
.secMain *{box-sizing:border-box;}
.secMain img{vertical-align:bottom;}
.contInr{width:950px; margin:0 auto;}
.notoSerif{font-family:'Noto Serif JP', serif;}
.sec01 h2, .sec02 h3{font-family:'Noto Serif JP', serif; font-weight:300;}
.sec01 p, .sec01 a, .sec01 dt, .sec01 dd, .sec01 span, .sec02 p, .sec02 a, .sec02 dt, .sec02 dd, .sec02 span{font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;}

/* svg animation */
.openingWrap{background:#1e6f6e; position:absolute; top:0px; left:0px; width:100%; height:100vh; z-index:999; transition:opacity 2s ease; overflow:hidden;}
.openingWrap .openingInr{position:relative; width:100%; height:100vh;}
.openingWrap .openingInr .mainLogo_op{display:none; padding:30px 30px 0 30px;}
.openingWrap .openingInr svg{position:absolute; top:50%; left:50%; transition:all 2s ease; transform:translate(-50%, -50%);}
.openingWrap.Ev_openingFinish{opacity:0;}
.openingWrap.Ev_openingFinish svg{transform:translate(-50%,-50%);}
#svgTitle .st0{fill:none; stroke:#FFFFFF; stroke-width:10; stroke-linecap:round; stroke-linejoin:round; stroke-miterlimit:10; stroke-dasharray:1500; stroke-dashoffset:1500;}
#svgTitle{max-width:100%; height:auto; opacity:0;}
#svgTitle.txtStart{opacity:1;}
.svgTxt{width:1080px; height:180px;}
.mainTtl{width:708px; opacity:0; transition:all 1s ease 1.6s; position:relative; right:-86px;}
.mainTtl img{width:100%;}
.Ev_normalCont .mainTtl{opacity:1;}

/* Main Section */
.secMain{height:100vh; overflow:hidden; position:relative;}
.secMain header{display:flex; justify-content:space-between; position:relative; z-index:1; padding:30px 30px 0 30px;}
.secMain header .mainLogo{position:relative; z-index:1010;}
.secMain header .snsList ul{font-size:0px;}
.secMain header .snsList li{display:inline-block; margin-left:20px;}
.secMain video{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); min-width:100vw; min-height:100vh; z-index:0;}
.secMain .mainInr{max-width:950px; position:relative; z-index:1; height:calc(100vh - 66px); margin:0 auto;}
.secMain .mainInr .mainCnt{position:absolute; right:0px; bottom:17vh;}
.secMain .mainInr .mainCnt .mainLead{color:#fff; font-size:30px; letter-spacing:0.5em; text-align:right;}
.secMain .mainInr .mainCnt .btnWT_op{display:inline-block; background-color:rgba(255,255,255,0.3); border:1px solid #fff; color:#fff; font-size:16px; transition:0.3s ease; position:relative; padding:10px 50px 10px 80px; margin-top:25px;}
.secMain .mainInr .mainCnt .btnWT_op:before{display:block; content:""; background:url(../img/icon_booking.png) 0 0 no-repeat; width:18px; height:18px; transition:0.3s ease; position:absolute; top:50%; left:50px; transform:translateY(-50%);}
.secMain .mainInr .mainCnt .btnWT_op:hover{background:rgba(255,255,255,0.5); box-shadow:0 0 5px rgba(255,255,255,0.5); text-decoration:none;}

.secMain .mainInr .scrollTxt{position:absolute; left:50%; bottom:0px; width:46px; height:98px; transform:translateX(-50%);}
.secMain .mainInr .scrollTxt:after{display:block; content:""; background:rgba(255,255,255,0.7); width:1px; height:80px; margin-left:23px; -webkit-animation:scroll 1.5s ease infinite; animation:scroll 1.5s ease infinite; opacity:0;}
.secMain .mainInr .scrollTxt img{vertical-align:top;}
@-webkit-keyframes scroll{
0%{-webkit-transform: translateY(0px); transform: translateY(0px); opacity:0.2;}
50%{opacity:1;}
100%{-webkit-transform:translateY(80px); transform:translateY(80px); opacity:0;}
}
@keyframes scroll{
0%{-webkit-transform:translateY(0px); transform:translateY(0px); opacity:0.2;}
50%{opacity:1;}
100%{-webkit-transform:translateY(80px); transform:translateY(80px); opacity:0;}
}

/* info */
.infoWrap{position:relative; width:100%; height:0px;}
.infoBox{background:#730808; box-sizing:border-box; color:#fff; position:absolute; right:0px; top:-60px; z-index:10; width:46vw; padding:18px 40px 30px 40px;}
.infoBox dt{font-size:16px; letter-spacing:0.1em; padding-left:30px; position:relative;}
.infoBox dt:before{display:block; content:""; background:url(../img/icon_info_ttl.png) 0 0 no-repeat; position:absolute; top:-2px; left:0px; width:19px; height:26px;}
.infoBox dd{font-size:14px; margin-top:20px;}
.infoBox a.cpnBtn{display:inline-block; color:#fff; line-height:1.5; letter-spacing:0.1em; position:relative; padding-right:60px;}
.infoBox a.cpnBtn:before,
.infoBox a.cpnBtn:after{display:block; content:""; position:absolute; transition:all 0.5s ease;}
.infoBox a.cpnBtn:before{border-bottom:1px solid #fff; width:40px; bottom:8px; right:4px;}
.infoBox a.cpnBtn:after{border-right:1px solid #fff; right:8px; bottom:7px; height:10px; transform:rotate(-45deg);}
.infoBox a.cpnBtn:hover{text-decoration:none;}
.infoBox a.cpnBtn:hover:before{animation:movearrow1 0.5s;}
.infoBox a.cpnBtn:hover:after{animation:movearrow2 0.5s;}
@keyframes movearrow1{0%{right:4px;}50%{right:0px;}100%{right:4px;}}
@keyframes movearrow2{0%{right:8px;}50%{right:4px;}100%{right:8px;}}

.fixBtn{position:fixed; right:30px; bottom:110px; width:140px; height:140px; z-index:9999; opacity:0; transition:all 1s ease; transform:translateX(170px);}
.fixBtn a{display:block; border-radius:50%; transition:opacity 0.3s ease;}
.fixBtn a img{border-radius:50%; vertical-align:bottom;}
.fixBtn a:hover{opacity:0.7;}
.fixBtn.validityFix{transform:translateX(0px); opacity:1;}


/* Section01 */
.sec01{background:url(../img/bg_sec_01.jpg) top center no-repeat; position:relative; min-height:950px;}
.sec01:before{display:block; content:""; background:url(../img/parts_reco_box_txt.png) 0 0 no-repeat; position:absolute; top:90px; left:50%; width:14px; height:174px; margin-left:-932px;}
.sec01 .subHeading{color:#1e6f6e; font-size:66px; font-weight:200; line-height:1.2;}
.sec01 .textBox{width:400px; padding-top:220px; opacity:0; transform:scale(1.1); transform-origin:top; transition:opacity 1.0s linear,-webkit-transform 1.0s cubic-bezier(0,.6,.2,1);}
.sec01 .textBox p{color:#0d0305; font-size:16px; line-height:2.5;}
.textBox.Ev_scale01{opacity:1; transform:scale(1.0); transform-origin:top;}

/* Section02 */
.sec02{overflow:hidden;}

/* recoBox layout */
.recoBox01{min-height:825px; position:relative;}
.recoBox01 .rb2_fullpanel{background:url(../img/bg_reco_box01_01.jpg) top center no-repeat #000; height:680px;}
.recoBox02{min-height:660px; position:relative; margin-top:90px;}
.recoBox02:before{display:block; content:""; background:url(../img/parts_reco_box_txt.png) 0 0 no-repeat; position:absolute; top:0px; right:50%; width:14px; height:174px; margin-right:-930px;}
.recoBox02 .rb2_panel0{top:120px; left:50%; width:960px; height:540px; margin-left:-960px;}
.recoBox02 .rb2_panel1,
.recoBox02 .rb2_panel2{display:inline-block; position:absolute; top:0; left:50%; width:870px; height:600px; margin-left:-870px; overflow:hidden;}
.recoBox02 .panelWrap02 .rb2_panel2_1,
.recoBox02 .panelWrap02 .rb2_panel2_2{right:50%; margin-right:-683px;}
.recoBox03{min-height:750px; position:relative; margin-top:100px;}
.recoBox03:before{display:block; content:""; background:url(../img/parts_reco_box_bg.png) 0 0 no-repeat; position:absolute; bottom:0px; left:50%; width:90px; height:750px; margin-left:-960px;}
.recoBox03 .rb2_panel0{top:125px; right:50%; width:960px; height:625px; margin-right:-960px;}
.recoBox03 .rb2_panel1,
.recoBox03 .rb2_panel2{display:inline-block; position:absolute; top:0; right:50%; width:870px; height:600px; margin-right:-870px; overflow:hidden;}
.recoBox03 .panelWrap02 .rb2_panel2_1,
.recoBox03 .panelWrap02 .rb2_panel2_2{left:50%; margin-left:-683px;}
.recoBox04{min-height:825px; position:relative;}
.recoBox04 .rb2_fullpanel{background:url(../img/bg_reco_box04_01.jpg) top center no-repeat; height:680px;}
.recoBox05{min-height:660px; position:relative; margin-top:90px;}
.recoBox05:before{display:block; content:""; background:url(../img/parts_reco_box_txt.png) 0 0 no-repeat; position:absolute; top:0px; right:50%; width:14px; height:174px; margin-right:-930px;}
.recoBox05 .rb2_panel0{top:120px; left:50%; width:960px; height:540px; margin-left:-960px;}
.recoBox05 .rb2_panel1,
.recoBox05 .rb2_panel2{display:inline-block; position:absolute; top:0; left:50%; width:870px; height:600px; margin-left:-870px; overflow:hidden;}
.recoBox05 .panelWrap02 .rb2_panel2_1,
.recoBox05 .panelWrap02 .rb2_panel2_2{right:50%; margin-right:-683px;}
.recoBox06{min-height:660px; position:relative; margin-top:100px;}
.recoBox06:before{display:block; content:""; background:url(../img/parts_reco_box_bg.png) 0 0 no-repeat; position:absolute; bottom:0px; left:50%; width:90px; height:660px; margin-left:-960px;}
.recoBox06 .rb2_panel0{top:120px; right:50%; width:960px; height:540px; margin-right:-960px;}
.recoBox06 .rb2_panel1,
.recoBox06 .rb2_panel2{display:inline-block; position:absolute; top:0; right:50%; width:870px; height:600px; margin-right:-870px; overflow:hidden;}
.recoBox06 .panelWrap02 .rb2_panel2_1,
.recoBox06 .panelWrap02 .rb2_panel2_2{left:50%; margin-left:-683px;}

/* conductBox layout */
.conductBox{background:#fff; box-sizing:border-box; color:#000; height:340px; position:absolute; opacity:0; transform:translateX(-30px);}
.conductBox.setC{top:485px; left:50%; width:800px; padding:55px 55px 0 55px; margin-left:-400px; transition:all 0.8s ease; transition-delay:0.3s; transform:scale(1.1);}
.conductBox.setR{top:320px; left:50%; width:535px; padding:60px 0 0 60px; margin-left:-60px; transition:all 1s ease; transition-delay:2s;}
.conductBox.setL{top:320px; right:50%; width:535px; padding:60px 60px 0 0; margin-right:-60px; transition:all 1s ease; transition-delay:2s;}
.conductBox.Ev_conduct01{opacity:1; transform:translate(0, 0) scale(1);}
.conductBox h3{font-size:38px; margin-top:5px;}
.conductBox .cdtTxt{font-size:16px; line-height:2.6; margin-top:30px;}
.conductBox .btnBox{position:absolute;}
.conductBox.setC .btnBox{right:55px; bottom:35px;}
.conductBox.setR .btnBox{right:0px; bottom:40px;}
.conductBox.setL .btnBox{right:50px; bottom:40px;}
.conductBox .mroeBtn{display:inline-block; border-bottom:1px solid #ccc; color:#000; font-size:13px; line-height:1; position:relative; min-width:140px; padding:20px 35px 10px 5px;}
.conductBox .mroeBtn:before,
.conductBox .mroeBtn:after{display:block; content:""; position:absolute; transition:all 0.5s ease;}
.conductBox .mroeBtn:before{border-bottom:1px solid #000; width:20px; bottom:12px; right:4px;}
.conductBox .mroeBtn:after{border-right:1px solid #000; right:8px; bottom:11px; height:10px; transform:rotate(-45deg);}
.conductBox .mroeBtn:hover{text-decoration:none;}
.conductBox .mroeBtn:hover:before{animation:movearrow1 0.5s;}
.conductBox .mroeBtn:hover:after{animation:movearrow2 0.5s;}
@keyframes movearrow1{0%{right:4px;}50%{right:0px;}100%{right:4px;}}
@keyframes movearrow2{0%{right:8px;}50%{right:4px;}100%{right:8px;}}

/* conductBox effect */
.rb2_panel0{display:inline-block; background:#e8f9ed; position:absolute;}
.rb2_panel1 span, .rb2_panel2 span{display:block; width:0px; height:100%; overflow:hidden; transition:all 1s ease; opacity:0;}
.rb2_panel1 span{background:#578f8e;}
.rb2_panel2 span{transition-delay:1s;}
.contents .rb2_panel1.Ev_start01 span, .contents .rb2_panel2.Ev_start01 span{width:100%; opacity:1;}
.rb2_panel2_1,
.rb2_panel2_2{display:inline-block; position:absolute; top:0; width:208px; height:208px; overflow:hidden;}
.rb2_panel2_1 span, .rb2_panel2_2 span{display:block; width:0px; height:100%; overflow:hidden; transition:all 1s ease; opacity:0;}
.rb2_panel2_1 span{background:#578f8e;}
.rb2_panel2_2 span{transition-delay:1s;}
.contents .rb2_panel2_1.Ev_start01 span, .contents .rb2_panel2_2.Ev_start01 span{width:100%; opacity:1;}


/* fullPanel effect */
.rb2_fullpanel:before{content:""; display:block; background:rgba(0,0,0,0.7); width:100%; height:680px; position:absolute; top:0; left:0; transition:all 1.7s ease-in;}
.Ev_conduct00 .rb2_fullpanel:before{opacity:0;}

/* conductTxt effect */
.cbInr{box-sizing:border-box; height:100%; opacity:0; transform:scale(1.20); transform-origin:top; transition:opacity 1.0s linear,-webkit-transform 1.0s cubic-bezier(0,.6,.2,1);}
.conductBox.setC .cbInr{padding-bottom:55px; transition-delay:0.8s;}
.conductBox.setL .cbInr,
.conductBox.setR .cbInr{padding-bottom:60px; transition-delay:2.2s;}
.Ev_conduct01 .cbInr{opacity:1; transform:scale(1.0); transform-origin:top;}

/* booking */
.bookingArea{margin-top:160px; min-height:820px;}
.tabList{font-size:0px;}
.tabList li{letter-spacing: normal;display:inline-block;line-height: 1;font-size: 0px;}

.mdlPanel{overflow:hidden;}
.mdlPanel .mdlL{float:left; width:390px;}
.mdlPanel .mdlL .mlInr{padding:35px 20px 35px 40px;}
.mdlPanel .mdlL .mlInr .enTtl{display:block; margin-top:-4px;}
.mdlPanel .mdlL .mlInr dt{font-family:'Noto Serif JP', serif; color:#000; font-size:34px; margin-top:10px;}
.mdlPanel .mdlL .mlInr dd{font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; color:#000; line-height:2.2; margin-top:20px;}
.mdlPanel .mdlR{float:right; width:540px;}
#cboxContent{overflow:visible !important;}
#cboxContent img{vertical-align:bottom;}
#cboxOverlay{background-color:rgba(0,0,0,0.9);}
#cboxClose{background:url(../img/btn_close.png) top center no-repeat; top:-50px; right:0px; width:37px; height:37px;}
#cboxLoadedContent{margin-bottom:0px;}
#colorbox, #cboxWrapper, #cboxContent, #cboxLoadedContent, .mdlCont{max-width:950px !important;}
#cboxTopLeft, #cboxTopCenter, #cboxTopRight, #cboxMiddleLeft, #cboxMiddleRight, #cboxBottomLeft, #cboxBottomCenter, #cboxBottomRight{width:0px !important; height:0px !important;}
#cboxTopLeft, #cboxTopCenter, #cboxTopRight{height:50px !important;}