@charset "utf-8";

/* =reset
------------------------------------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td,header, section, article, footer, article, aside, time ,nav,a{
margin:0;
padding:0;
}

fieldset,img{
  border:0;
}
address,caption,cite,code,dfn,em,th,var{
font-style:normal;
font-weight:normal;
}
ol,ul{
list-style:none;
}
caption,th{
text-align:left;
}
h1,h2,h3,h4,h5,h6{
font-size:100%;
font-weight:normal;
}
q:before,q:after{
content:'';
}
abbr,acronym{
border:0;
}
p{
text-justify:inter-ideograph;
margin: 0;
-webkit-margin-before: 0;
-webkit-margin-after: 0;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
}

header, section, article, footer, article, aside, time ,nav { display: block; }

ul{
-webkit-margin-before: 0;
-webkit-margin-after: 0;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
-webkit-padding-start: 0;
}
figure {
display: block;
-webkit-margin-before: 0;
-webkit-margin-after: 0;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
}

button{
background-color: transparent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
}

/* =base
------------------------------------------------------------------------------------------*/
* { box-sizing: border-box; }
body { background: #fff; color: #000; counter-reset: number 0; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-size: 14px; font-weight: 500; line-height: 1.6em; }
img { vertical-align: bottom; }
a,
a:hover { text-decoration: none; outline: none; }
a { color: #996600; }
a:hover { color: #990000; }
a:hover img { opacity: 0.8; filter: alpha(opacity=80); }

/* =ページトップ
------------------------------------------------------------------------------------------*/
.page_top { text-align: right; margin: 0; width:80px; text-align: center; position: fixed; right: 60px; bottom: 40px; z-index:10; }
.page_top a { background: #000; display: block; border-radius: 50%; height: 80px; width: 80px; line-height: 80px; color: #fff; font-family: 'Oswald'; font-size: 12px; }
.page_top a:hover { background: #e97611; text-decoration: none; }

/* =header
------------------------------------------------------------------------------------------*/
header .header-wrap { margin: 0 auto; padding: 20px 0 14px; width: 92%; max-width: 1000px; }
header .header-wrap h1.logo { margin-right: 12px; width: 40%; max-width: 142px; }
header .header-wrap h1.logo a { display: block; }
header .header-wrap h1.logo a img { width: 100%; }
footer { padding: 48px 0 48px; }
footer .copyright { font-size: 12px; line-height: 1.2em; text-align: center; }


/* = parts　*/
.pc-none { display: none; }
.sp-none { display: block; }

/* 横並びbox */
.clearfix::after,
.clearfix::before,
.float-box::after,
.float-box::before { content: ""; clear: both; display: block; }
.float-box { width: 102%; margin-bottom: -5%;}
.float-box .box01 { width: 98%; margin-bottom: 5%;}
.float-box .box02,
.float-box .box03,
.float-box .box04 { float: left; margin: 0 2% 5% 0; }
.float-box .box02 { width: 48%; }
.float-box .box03 { width: 31.3%; }
.float-box .box04 { width: 23%; }
.float-box .box01 img,
.float-box .box02 img,
.float-box .box03 img,
.float-box .box04 img { width: 100%; }
.table-box { display: table; width: 100%; }
.table-box .box02,
.table-box .box03,
.table-box .box04 { display: table-cell; vertical-align: middle; }
.table-box .box02 { width: 50%; }
.table-box .box03 { width: 33.3%; }
.table-box .box04 { width: 25%; }
.table-box .box02 img,
.table-box .box03 img,
.table-box .box04 img { width: 100%; }
.flex-box{ display: flex; flex-wrap: wrap; width: 102%; margin-bottom: -5%;}
.flex-box .box01 { width: 98%; margin-bottom: 5%;}
.flex-box .box02,
.flex-box .box03,
.flex-box .box04 { margin: 0 2% 5% 0; }
.flex-box .box02 { max-width: 48%; flex-basis: 48%;}
.flex-box .box03 { max-width: 31.3%; flex-basis: 31.3%;}
.flex-box .box04 { max-width: 23%; flex-basis: 23%;}
.flex-box .box01 img,
.flex-box .box02 img,
.flex-box .box03 img,
.flex-box .box04 img{ width: 100%; }

/* font */
.moreless { font-size: .8em; line-height: 1.4em; }
.less { font-size: .9em; line-height: 1.4em; }
.mid { font-size: 1.1em; line-height: 1em; }
.big { font-size: 1.2em; line-height: 1em; }
.bigger { font-size: 1.3em; line-height: 1em; }
.biggest { font-size: 1.5em; line-height: 1em; }
.font-bold { font-weight: bold; }
.font-normal { font-weight: normal; }
.font-minchou { font-family: "ＭＳ 明朝",serif; font-weight: normal; }
.font-italic { font-style: italic; }
.copyright { font-size: 12px; line-height: 1.4em;}

/* textColor */
.text-red { color: #cc0000; }
.text-white { color: #fff; }
.text-black { color: #000; }
.sat { color: #0b5792; }
.sun { color: #a63646; }

/* textAlign */
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

/* margin */
.mb-05vw { margin-bottom: .5vw !important; }
.mb-1vw { margin-bottom: 1vw !important; }
.mb-2vw { margin-bottom: 2vw !important; }
.mb-3vw { margin-bottom: 3vw !important; }
.mb-4vw { margin-bottom: 4vw !important; }
.mb-5vw { margin-bottom: 5vw !important; }
.mb-6vw { margin-bottom: 6vw !important; }
.mb-7vw { margin-bottom: 7vw !important; }
.mb-8vw { margin-bottom: 8vw !important; }
.mb-9vw { margin-bottom: 9vw !important; }
.mb-10vw { margin-bottom: 10vw !important; }
.mb-01em { margin-bottom: .1em !important; }
.mb-02em { margin-bottom: .2em !important; }
.mb-03em { margin-bottom: .3em !important; }
.mb-04em { margin-bottom: .4em !important; }
.mb-05em { margin-bottom: .5em !important; }
.mb-06em { margin-bottom: .6em !important; }
.mb-07em { margin-bottom: .7em !important; }
.mb-08em { margin-bottom: .8em !important; }
.mb-09em { margin-bottom: .9em !important; }
.mb-1em { margin-bottom: 1em !important; }
.mb-2em { margin-bottom: 2em !important; }

/* linkButtonBased */
.link-button a { box-sizing: border-box; text-decoration:none;  display: block; border-radius: 100px; font-size: 22px; font-weight: bold; line-height: 1em; margin: 0 auto; padding: 30px 10px; position: relative; text-align: center; transition: .1s; width: 90%; max-width: 550px;}
.link-button a:hover { text-decoration: none; opacity: .8;}
.link-button a:active { box-shadow: none; }

button.link-button { box-sizing: border-box; text-decoration:none;  display: block; border-radius: 100px; font-size: 22px; font-weight: bold; line-height: 1em; margin: 0 auto; padding: 30px 10px; position: relative; text-align: center; transition: .1s; width: 90%; max-width: 550px;}
button.link-button:hover { text-decoration: none; opacity: .8;}
button.link-button:active { box-shadow: none; }

/* linkButtonColor */
.link-button a { background: #f16baa; color: #fff; }
button.link-button { background: #f16baa; color: #fff; }

.main-wrap { display: block; margin: 0 auto; position: relative; width: 92%; max-width: 1000px; }
.text-list p,
.text-list ul li { padding: 0 0 .2em 1.1em; position: relative; text-align: left; }
.text-list p:not(:last-of-child) { margin-bottom: 1em; }
.text-list ul li:not(:last-of-child) { margin-bottom: .4em; }
.text-list p::before,
.text-list ul li::before { content: "※"; position: absolute; left: 0; }
.text-list-dotted p::before,
.text-list-dotted ul li::before { content: "・"; }
.text-list li.number1::before { content: "①"; }
.text-list li.number2::before { content: "②"; }
.alart-box { color: #dd0000; font-size: 20px; font-weight: bold; line-height: 1.4em; margin: 0 auto; position: relative; text-align: center; }
.alart-box p { display: inline-block; padding: 1em; }
.alart-box p::before,
.alart-box p::after{ background: url(../images/exclamation.png) center center no-repeat; background-size: contain; content: ""; position: absolute; top: calc(50% - 26px); width: 50px; height: 45px; }
.alart-box p::before { left: 0; }
.alart-box p::after { right: 0; }

.outer-wrap { margin: 0 auto 32px; width: 80%; }
.outer-wrap dl { margin-bottom: 32px; }
.outer-wrap dl dt { display: table; position: relative; width: 100%; z-index: 2; }
.outer-wrap dl dt img { width: 100%; }
.outer-wrap dl dt .left,
.outer-wrap dl dt .right { display: table-cell; vertical-align: middle; }
.outer-wrap dl dt .left { overflow-y: hidden; width: 100px; }
.outer-wrap dl dt .right { font-size: 20px; font-weight: bold; line-height: 1.6em; margin-bottom: 20px; padding-left: 16px; position: relative; }
.outer-wrap dl dt .right span { font-size: 14px; font-weight: normal; line-height: 1.2em; }
.outer-wrap dl dd { padding: 16px 0 0 116px; position: relative; }
.outer-wrap dl:not(:last-of-type) dd::after { border: 1px solid; content: ""; position: absolute; left: 50px; bottom: -50%; height: 180%; z-index: 1; }
.outer-wrap dl dd .link-btn a { border: 3px solid #ccc; color: #000; display: block; font-size: 18px; font-weight: bold; line-height: 1em; margin-bottom: 1em; padding: .9em 0 .8em; position: relative; text-align: center; transition: .15s; width: 80%; }
.outer-wrap dl dd .link-btn a:hover { color: #ccc; }
.outer-wrap dl dd .text-list ul li { font-size: 14px; line-height: 1.4em; }
.outer-wrap dl dd .text-list ul li:not(:last-of-type) { margin-bottom: .2em; }
.outer-wrap dl dd .touraku .tousen,
.outer-wrap dl dd .touraku .rakusen { border: 2px solid; display: table; width: 92%; }
.outer-wrap dl dd .touraku .left,
.outer-wrap dl dd .touraku .right { display: table-cell; font-weight: bold; vertical-align: middle; }
.outer-wrap dl dd .touraku .left { color: #fff; font-size: 20px; line-height: 1em; padding: 15px 0; text-align: center; width: 16%; }
.outer-wrap dl dd .touraku .right { font-size: 16px; line-height: 1.6em; padding: .8em .7em .7em; width: 84%; }
.outer-wrap dl dd .touraku .tousen { border-color: #e97611; margin-bottom: 16px; }
.outer-wrap dl dd .touraku .tousen .left { background: #e97611; }
.outer-wrap dl dd .touraku .tousen .right { color: #e97611; }
.outer-wrap dl dd .touraku .rakusen { border-color: #017398; }
.outer-wrap dl dd .touraku .rakusen .left { background: #017398; }
.outer-wrap dl dd .touraku .rakusen .right { color: #017398; }

.content-wrap { margin: 0 auto 32px; width: 96%; }
.content-wrap p:not(:last-of-type) { margin-bottom: 1em; }
.content-wrap .float-box { width: 102%; margin-bottom: 0;}
.content-wrap .float-box::after { content: ""; clear: both; display: block; }
.content-wrap .float-box h3 { font-size: 20px; font-weight: bold; line-height: 1.4em; margin-bottom: .6em; text-align: center; }
.content-wrap .float-box h3 span { font-size: 14px; font-weight: normal; line-height: 1.4em; }
.content-wrap .float-box img { width: 100%; }
.content-wrap .float-box .box02,
.content-wrap .float-box .box03 { float: left; }
.content-wrap .box01 { margin: 0 auto; text-align: left; width: 50%; }
.content-wrap .float-box .box02 { margin: 0 6% 5% 0; width: 44%; }
.content-wrap .float-box .box03 { margin: 0 4% 5% 0; width: 29.3%; }
.content-wrap .float-box .inner-float::after { content: ""; clear: both; display: block; }
.content-wrap .float-box .inner-float { width: 102%; }
.content-wrap .float-box .inner-float .inner-box02 { float: left; margin: 0 2% 5% 0; width: 48%; }
.content-wrap .float-box .inner-float .inner-box02:first-child { width: 30%; }
.content-wrap .float-box .inner-float .inner-box02:last-child { width: 66%; }
.content-wrap .float-box .inner-float .inner-box02:last-child img { margin-bottom: 10px; }

.content-wrap .period-box dt { background: #f2a000; color: #fff; font-size: 20px; font-weight: bold; line-height: 1em; margin-bottom: 1em; padding: .8em 0 .7em; position: relative; text-align: center; width: 100%; }
.content-wrap .period-box dt::after { border: 1em solid transparent; border-top: 1em solid #f2a000; content: ""; position: absolute; bottom: -2em; left: calc(50% - 1em); }
.content-wrap .period-box dd { background: #f1f1f1; border: none; box-sizing: border-box; color: #000; font-size: 20px; font-weight: bold; line-height: 1.4em; margin: 0 auto 32px; padding: 1em 0; text-align: center; width: 100%; }






#title { background: #e97611; color: #fff; margin: 0 auto 32px; padding: 30px 0 0; width: 100%; max-width: 1000px; }
#title h2 { font-size: 26px; font-weight: bold; line-height: 1.2em; margin-bottom: 24px; padding: 0 32px; }
#title .inner-wrap { background: #000; padding: 24px 30px; }
#title .inner-wrap p { font-size: 20px; line-height: 1.6em; }
#title .inner-wrap p.small-text { font-size: 14px; }

#kaiin-info { margin-bottom: 32px; }
#kaiin-info img { width: 100%; }

#pre,
#ippan { border: 2px solid; border-radius: 3px; margin-bottom: 32px; }
#pre { border-color: #cc0000; }
#ippan { border-color: #313494; }
#pre h2,
#ippan h2 { color: #fff; font-size: 26px; font-weight: bold; line-height: 1em; margin-bottom: 32px; padding: .8em 0 .7em; text-align: center; }
#pre h2 { background: #cc0000; }
#ippan h2 { background: #313494; }

#pre .outer-wrap dl dt .right,
#pre .outer-wrap dl dd .text-list ul li { color: #dd0000; }
#pre .outer-wrap dl:not(:last-of-type) dd::after { border-color: #dd0000; }
#pre .outer-wrap .alart-box { width: 500px; }

#ippan .outer-wrap dl dt .right,
#ippan .outer-wrap dl dd .text-list ul li { color: #313494; }
#ippan .outer-wrap dl:not(:last-of-type) dd::after { border-color: #313494; }
#ippan .outer-wrap .alart-box { width: 550px; }

#payment h2,
#uketori h2,
#qa h2 { background: #e97611; color: #fff; font-size: 26px; font-weight: bold; line-height: 1em; margin-bottom: 32px; padding: .8em 0 .7em; text-align: center; width: 100%; }

#uketori .content-wrap { width: 86%; }
#uketori .content-wrap .alart-box { width: 500px; }
#uketori .wide-wrap{width: 66%;}

#qa .content-wrap dl:not(:last-of-type) { margin-bottom: 1.6em; }
#qa .content-wrap dl dt,
#qa .content-wrap dl dd { padding-left: 1.4em; position: relative; }
#qa .content-wrap dl dt::before,
#qa .content-wrap dl dd::before { position: absolute; left: 0; }
#qa .content-wrap dl dt::before { content: "Q:"; }
#qa .content-wrap dl dd::before { content: "A:"; }
#qa .content-wrap dl dt { font-size: 16px; font-weight: bold; line-height: 1.4em; margin-bottom: .8em; }
#qa .content-wrap dl dd:not(:last-of-type) { margin-bottom: 1em; }
#qa .link-button a { background: #f3c66f; box-sizing: border-box; color: #fff; display: block; border-radius: 4px; font-size: 18px; font-weight: bold; line-height: 1em; margin: 0 auto 16px; padding: .9em 0 .8em; position: relative; text-align: center; transition: .1s; width: 48%;}
#qa .suishou { text-align: center; }


/* 20230125 add */
.icon-text{position: relative;}
.icon-text::before {position: absolute;content: "";top: 50%;transform: translate3d(0,-50%,0);left: 40px;background-repeat: no-repeat;background-size: contain;}
.icon-text.icon-qr-ticket{padding-left: 100px;}
.icon-text.icon-qr-ticket::before {background-image: url(../images/icon_qr_ticket.png);width: 137px;height: 143px;}

.link-button.orange-button a { background: transparent; color: #f27900; border: 2px solid #f27900;}

#uketori .content-wrap:not(:last-of-type) { margin-bottom: 60px; }




@media screen and (max-width: 768px){
header .header-wrap h1.logo { width: 32%; }

.link-button a {font-size: 16px;padding: 20px 10px;}

.page_top { display: none; }
#pre .outer-wrap .alart-box,
#ippan .outer-wrap .alart-box,
#uketori .content-wrap .alart-box { width: 100%; }
.outer-wrap,
.outer-wrap dl,
#title,
#kaiin-info,
#pre,
#ippan,
#payment h2,
#uketori h2,
#qa h2,
.content-wrap,
.content-wrap .period-box dd { margin-bottom: 9vw; }
#title { padding: 18px 0 0; }
#title h2 { font-size: 18px; line-height: 1.4em; margin: 0 auto 18px; padding: 0; width: 92%; }
#title .inner-wrap { margin: 0 auto; padding: 18px 4%; }
#title .inner-wrap p { font-size: 16px; margin-bottom: .5em; }
#pre h2, #ippan h2 { font-size: 20px; margin-bottom: 1em; }
.outer-wrap { width: 90%; }
.outer-wrap dl dt .left, .outer-wrap dl dt .right { display: block; }
.outer-wrap dl dt .left { margin-bottom: 10px; width: 55px; }
.outer-wrap dl dt .right { font-size: 16px; padding-left: 0; }
.outer-wrap dl dd { padding: 0; }
.outer-wrap dl dd .link-btn a { width: 100%; }
.outer-wrap dl:not(:last-of-type) dd::after { display: none; }
.outer-wrap dl dd .touraku .tousen, .outer-wrap dl dd .touraku .rakusen { width: 100%; }
.outer-wrap dl dd .touraku .left { font-size: 18px; width: 20%; }
.outer-wrap dl dd .touraku .right { font-size: 14px; }
.alart-box { font-size: 16px; padding-left: 22px; text-align: left; }
.alart-box p::before, .alart-box p::after { top: calc(50% - 14.5px); height: 29px; width: 32px; }
.alart-box p::after { display: none; }
#payment h2, #uketori h2, #qa h2 { font-size: 20px; }
.content-wrap .float-box h3 { font-size: 18px; }
.content-wrap .float-box { width: 100%; }
.content-wrap .box01,
.content-wrap .float-box .box02,
.content-wrap .float-box .box03 { float: none; margin: 0 0 9vw; width: 100%; }
.content-wrap .period-box dt { font-size: 18px; }
.content-wrap .period-box dd { font-size: 16px; padding: 1em; }
#payment .content-wrap,
#uketori .content-wrap { width: 82%; }
#qa .link-button a { font-size: 16px; width: 90%; }
#uketori .wide-wrap{width: 100%;}


/* 20230125 add */
.icon-text::before {position: absolute;content: "";top: 50%;transform: translate3d(0,-50%,0);left: 40px;background-repeat: no-repeat;background-size: contain;}
.icon-text.icon-qr-ticket{padding-left:0px;padding-top: 90px;}
.icon-text.icon-qr-ticket::before {top: 0;left: 50%;transform: translate3d(-50%,0,0);width: 75px;height: 78px;}

#uketori .content-wrap { width: 92%; }

}





/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxContent{margin-top:20px;background:#000;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{border:5px solid #000; background:#fff;}
        #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
        #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}
        #cboxLoadingGraphic{background:url(../images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
        #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
        #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(../images/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:bottom left;}
        #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(../images/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
        #cboxNext:hover{background-position:bottom right;}
        #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url(../images/controls.png) no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
        #cboxClose:hover{background-position:bottom center;}