@charset "UTF-8";

*{outline:none;}

/* =========================================================
body
=========================================================== */
body{
background:#dadee0 url(../img/layout/bg_img.png) center top;
background-size:12px 12px;
font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
}

@media (max-width: 768px){
body{
background:#dadee0 url(../img/layout/bg_img.png) center top;
background-size:10px 10px;
}
}

/* =========================================================
.l-main__img
=========================================================== */
.l-main__img{
position:relative;
margin:0 auto 15px;
border-bottom:12px solid #267b80;
}
.l-main__img img{
width:100%;
height:auto;
display:block;
}
.l-main__img_a{
position:absolute;
top:0;
left:50%;
margin:0 0 0 -25%;
width:51.89%;
height:auto;
}
.l-main__img_b{
position:absolute;
top:0;
left:50%;
margin:0 0 0 -25%;
width:51.89%;
height:auto;
opacity:0;
}


/* =========================================================
.l-container
=========================================================== */
section{
padding:0 15px 15px;
}
.l-container{
margin:0 auto;
max-width:1032px;
}
.l-container__inner{
margin:0 15px;
background:#000000;
box-shadow:0 0 6px 4px rgba(32, 32, 32, 0.25);
}

/* =========================================================
Bootstrap
=========================================================== */
.row{
margin-right:0;
margin-left:0;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto,
.col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto,
.col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto,
.col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto,
.col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
padding-right:4px;
padding-left:4px;
}
@media (max-width: 768px){
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto,
.col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto,
.col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto,
.col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto,
.col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
padding-right:2px;
padding-left:2px;
}
}

/* =========================================================
.l-header
=========================================================== */
.l-header{
margin:0 auto;
background:#131313;
color:#ffffff;
overflow:hidden;
}
.l-header__inner{
margin:0 auto;
max-width:1032px;
height:12px;
}
.l-header__logo{
margin:0 auto;
width:114px;
height:auto;
line-height:1;
}
.l-header__logo img{
width:100%;
height:auto;
display:block;
}

/* =========================================================
.container
=========================================================== */
.container{
padding-right:0;
padding-left:0;
max-width:none;
}

@media (min-width: 1200px){
.container{
max-width:none;
}
}
@media (min-width: 992px){
.container{
max-width:none;
}
}
@media (min-width: 768px){
.container{
max-width:none;
}
}
@media (min-width: 576px){
.container{
max-width:none;
}
}

/* =========================================================
.l-item
=========================================================== */
.l-item__title{
margin:0;
font-size:31px;
font-weight:bold;
font-style: italic;
line-height:1.3;
text-align:center;
text-shadow:2px 2px 2px rgba(32, 32, 32, 0.15);
color:#ffffff;
}
.l-item__title .sponly{
display:none;
}
.l-item{
margin:0 0 20px;
}
.l-item__box{
position:relative;
margin:0 auto;
padding:0 10px;
width:64%;
border-top: 1px dotted #4292b8;
}
.l-item__box:first-child{
border-top:5px solid #99cae0;
}
.l-item__box:last-child{
border-bottom:5px solid #99cae0;
}
.l-item__dt{
padding:8px 1% 8px 0;
width:38%;
font-size:20px;
line-height:24px;
font-weight:bold;
color:#00547b;
display:inline-block;
}
.l-item__dd{
padding:8px 0 8px 1%;
width:58%;
font-size:18px;
line-height:24px;
display:inline-block;
}
.l-item__notice{
margin:0 0 15px;
font-size:14px;
text-align:center;
}
.l-item__notice:last-child{
margin:0;
}

@media (max-width: 768px){
.l-item__title{
font-size:29px;
line-height:1.2;
text-align:center;
}
.l-item__title .sponly{
display:inline;
}
.l-item{
margin:0 0 10px;
}
.l-item__box{
width:72%;
}
.l-item__box:first-child{
border-top:4px solid #99cae0;
}
.l-item__box:last-child{
border-bottom:4px solid #99cae0;
}
.l-item__dt{
padding:6px 0 0;
width:auto;
font-size:17px;
line-height:1.3;
display:block;
}
.l-item__dd{
padding:0 0 6px;
width:auto;
font-size:15px;
line-height:1.3;
display:block;
}
.l-item__notice{
margin:0 0 10px;
font-size:12px;
text-align:center;
}
}

/* =========================================================
.l-footer
=========================================================== */
.l-footer{
background:#131313;
border-top:#4a4a4a 1px solid;
padding:12px 0;
}
.l-footer__inner{
margin:0 auto;
max-width:1032px;
}
.l-footer__logo{
margin:0 auto 8px;
width:64px;
}
.l-footer__logo img{
width:100%;
height:auto;
display:block;
}
.l-footer__notice{
margin:0 0 8px;
color:#f4f4f4;
font-size:12px;
line-height:1.3;
text-align:center;
}
.l-footer__copy{
color:#f4f4f4;
font-size:11px;
line-height:1.3;
text-align:center;
}

/* =========================================================
carousel
=========================================================== */
.l-carousel{
margin:0;
padding:0 0 15px;
box-sizing:border-box;
border-bottom:1px solid #267b80;
}
.carousel-inner{
border-radius:6px;
}
.carousel-indicators{
position:relative;
right:auto;
bottom:auto;
left:auto;
margin:0;
padding:0;
background-color:transparent;
flex-wrap:wrap;
}
.carousel-indicators li{
box-sizing:content-box;
-ms-flex:0 0 19%;
flex:0 0 19%;
margin-right:0.5%;
margin-left:0.5%;
padding:10px 0 0;
width:auto;
height:auto;
text-indent:0;
background-color:transparent;
background-clip:padding-box;
border-top:0;
border-bottom:0;
transition:opacity .6s ease;
cursor:pointer;
opacity:1;
}
.carousel-indicators li:hover{
opacity:.5;
}
.carousel-indicators li img{
width:100%;
height:auto;
display:block;
cursor:pointer;
border-radius:4px;
overflow:hidden;
}

.carousel-control-next{
justify-content:flex-end;
color:rgba(0,0,0,.25);
background:none;
padding-right:5px;
font-size:32px;
}
.carousel-control-prev{
justify-content:flex-start;
color:rgba(0,0,0,.25);
background:none;
padding-left:5px;
font-size:32px;
}
.carousel-control-next-icon, .carousel-control-prev-icon{
display:inline-block;
width:30px;
height:30px;
background:none;
}

.carousel-control-next:focus,
.carousel-control-next:hover,
.carousel-control-prev:focus,
.carousel-control-prev:hover{
color:rgba(0,0,0,.5);
}

/* =========================================================
.l-youtube
=========================================================== */
.l-youtube__title{
margin:0;
font-size:22px;
font-weight:bold;
font-style: italic;
line-height:2;
text-align:center;
text-shadow:2px 2px 5px rgba(0, 0, 0, 0.8);
color:#ffffff;
background:#000000 url(../img/layout/bg_youtube.png) center top;
background-size:12px 12px;
overflow:hidden;
}
.l-youtube{
width:100%;
margin:0 0 15px;
padding:0;
box-sizing:border-box;
border-bottom:1px solid #267b80;
}
.l-youtube .inner{
margin:0 0 15px;
padding-top:56.25%;
position:relative;
height:0;
overflow:hidden;
}
.l-youtube .inner iframe{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

@media (max-width: 768px){
.l-youtube__title{
font-size:18px;
line-height:1.8;
background:#000000 url(../img/layout/bg_youtube.png) center top;
background-size:10px 10px;
}
}

/* =========================================================
.l-howto
=========================================================== */
.l-howto{
position:relative;
margin:0 0 15px;
padding:0;
}
.l-howto__img{
font-size:0;
line-height:1;
virtical-align:top;
}
.l-howto__img img{
border:5px solid #99cae0;
border-radius: 6px;
background:#99cae0;
overflow: hidden;
display:block;
vertical-align: top;
}
@media (max-width: 768px){
.l-howto__img img{
border:3px solid #99cae0;
border-radius: 6px;
}
}

/* =========================================================
.l-title
=========================================================== */
.l-title{
margin:0 0 15px;
font-size:36px;
font-weight:bold;
font-style: italic;
line-height:1.3;
text-align:center;
letter-spacing:.1em;
text-shadow:2px 2px 5px rgba(0, 0, 0, 0.8);
color:#ffffff;
background:#267b80 url(../img/layout/bg_title.png) center top;
background-size:12px 12px;
overflow:hidden;
}
@media (max-width: 768px){
.l-title{
font-size:26px;
line-height:1.2;
background:#267b80 url(../img/layout/bg_title.png) center top;
background-size:10px 10px;
}
}
.c-contact__wrap .l-title{
margin:0 0 10px;
font-size:22px;
line-height:1.4;
text-align:center;
text-shadow:2px 2px 2px rgba(32, 32, 32, 0.15);
}
@media (max-width: 768px){
.c-contact__wrap .l-title{
margin:0 0 8px;
font-size:18px;
line-height:1.3;
}
}

/* =========================================================
Loading
=========================================================== */
#load{
position:fixed;
width:100%;
height:100%;
z-index:1000;
background:#ffffff url(../img/layout/bg_img.png) center top;
background-size:12px 12px;
background-attachment:fixed;
}
#load .inner{
position:absolute;
top:46%;
left:50%;
margin:-120px 0 0 -120px;
width:240px;
height:240px;
}
#load .inner img{
width:100%;
height:auto;
display:block;
}

@media (max-width: 768px){
#load{
position:fixed;
width:100%;
height:100%;
z-index:1000;
background:#ffffff url(../img/layout/bg_img.png) center top;
background-size:10px 10px;
background-attachment:fixed;
}
#load .inner{
top:50%;
margin:-60px 0 0 -60px;
width:120px;
height:120px;
}
}