@charset "UTF-8";
.feature_box {
    padding: 20px;
    background: linear-gradient(to right, #de1785, #009fe5);
    display: flex;
    height: 140px;
    justify-content: center;
    align-items: center;
}
.feature_text{
    width: 100%;
    max-width: 1000px;
}

.bg_yellow02{
    padding-bottom: 0;
}
.content_links li{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto 100px;
}
.content_links li:last-of-type{
    margin-bottom: 160px;
}
.content_txt{
    width: 50%;
    transition-duration: 0.6s;
}
.content_txt:hover{
    opacity: 0.5;
}
.content_img{
    width: 45%;
    border-radius: 10px;
    overflow: hidden;
}

.info_ttl{
    text-align: center;
    /* height: 26px; */
    /* padding-bottom: 20px; */
    /* border-bottom: solid 1px #333; */
    box-sizing: content-box;
    margin-bottom: 40px;
    font-style: normal;
}
.info_ttl p{
    font-size: 25px;
    letter-spacing: 0.4em;
    font-family: asap, sans-serif;
    font-weight: 700;
}
.info_ttl img{
    height: 100%;
    width: auto;
}
.info_txt{
    /* background: #e4007f; */
    /* padding: 20px 10px; */
    /* color: #e4007f; */
	padding: 15px;
    /*border: 10px double #ECC656;
    background-color: #f9f4ca;*/
	/*background: linear-gradient(90deg, rgb(217 171 17) 0%, rgb(255 255 255) 50%, rgb(218 173 28) 100%);*/
}
.info_txt p{
    text-align: center;
    color: #e4007f;
    line-height: 1.8;
    FONT-VARIANT: JIS04;
    font-size: 30px;
    letter-spacing: 0.2em;
    font-weight: 600;
}
.info_txt .normal {
    text-align: center;
    padding: 20px;
    background: linear-gradient(45deg, #B67B03 0%, #DAAF08 45%, #FEE9A0 70%, #DAAF08 85%, #d49b28 90% 100%);
}

.info_txt .normal2 {
    text-align: center;
    padding: 20px;
    background: #fff;
    margin-bottom: 30px;
    border: 1px solid #e4007f;
}

.info_txt .normal p.lead {
    color: #000;
    line-height: 1.5;
    FONT-VARIANT: JIS04;
    font-size: 28px;
    letter-spacing: 0.2em;
    font-weight: 600;
    font-weight: bold;
}

.info_txt .normal2 p.lead {
    color: #000;
    line-height: 1.5;
    FONT-VARIANT: JIS04;
    font-size: 28px;
    letter-spacing: 0.2em;
    font-weight: 600;
    font-weight: bold;
    color: #e4007f;
    
}

.info_txt .normal p.lead span {
    font-size: 26px;
}

.info_txt .normal2 p.lead span {
    font-size: 21px;
}

.info_txt .normal .info_ttl {
    margin-bottom: 15px;
}
.info_txt .normal .info_ttl p {
    color: #b20f39;
}


.bnr_info{
    max-width: 500px;
    margin: 60px auto 100px;
}

.bnr_info_boxup{
    max-width: 1020px;
    margin: 80px auto;
    box-sizing: content-box;
    transition-duration: 0.6s;
}

.panorama-bnr {
    /* margin-top: 50px; */
}

.panorama-bnr .ttl {
    text-align: center;
    font-size: 25px;
    font-family: fot-tsukubrdgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
}

.panorama-bnr ul {
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
}


/*.panorama-bnr ul { margin-top:30px; display:flex; justify-content:center; }*/

.panorama-bnr ul li {
    width: 48%;
    border-radius: 10px;
    overflow: hidden;
}

.for_ones_box{
    display: flex;
    align-items: center;
    justify-content: center;
    background: #00a0e9;
    color: #fff;
    height: 100%;
    height: 575px;
    /* margin-bottom: 80px; */
    padding: 20px 40px;
    box-sizing: border-box;
}
.for_ones_box > div{
    height: 100%;
    width: 100%;
}
.for_o_more{
    position: absolute;
    bottom: 20px;
    right: 40px;
}

.for_o_more a{
    /* background: #fff; */
    position: relative;
    color: #fff;
    margin-top: 0 !important;
    font-weight: bold;
    display: flex;
    /* align-items: flex-end; */
    justify-content: flex-end;
    line-height: 1;
    /* height: 40px; */
    cursor: pointer;
    font-weight: 400;
    transition-duration: 0.6s;
    font-size: 16px;
    padding-right: 10px;
    /* position: absolute; */
    /* bottom: 0; */
}
.for_o_more a::before{
    content: "";
    background: url(../img/top/arrow01.svg) no-repeat;
    background-size: contain;
    width: 15px;
    height: 10px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -15px;
}
.for_o_more a:hover {
    /* background: #c3b692; */
    transition-duration: 0.6s;
    opacity: 0.6;
}

.top_introduction{
    display: flex;
    margin: 0 auto 120px;
	justify-content: center;
}
.intro_box{
    width: 70%;
    text-align: center;
}
.intro_ttl {
    max-width: 468px;
    margin: 0 auto;
    padding: 0 10px;
}

.intro_text_box{
    /* padding: 130px 0; */
    /* background: #1b1b1b; */
    color: #fff;
    height: 100%;
    position: relative;
}

.intro_text_box p{
    margin-top: 20px;
    font-size: 12px;
    text-align: left;
    line-height: 2.5;
}

.forones_ttl p{
    text-align: left;
    font-size: 40px;
    font-family: asap, sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    margin: 0;
}

.videobox{
  /* padding-top: 56%; */
  position: relative;
  /* height: 30vw; */
  display: flex;
  align-items: center;
  aspect-ratio: 16 / 9;
  background: #000;
}
.intro_box iframe{
    width: 100%;
    height: 100%;
    /* object-fit: cover; */
    /* position: absolute; */
    /* top: 50%; */
    /* left: 0; */
    /* height: 20vw; */
    /* transform: translateY(-50%); */
}



.span_red01{
    color: #c00000;
    font-weight: bold;
}
.span_red02{
    color: #f31f00;
    font-weight: bold;
}

.span_green01{
    color: #00b050;
    font-weight: bold;
}
.span_blue01{
    color: #1f4e78;
    font-weight: bold;
}
.span_blue02{
    color: #00b0f0;
    font-weight: bold;
}

.kit_p01{
    color: #000;
    font-weight: bold;
    font-size: 20px;
}
.kit_p02{
    color: #000;
    font-weight: bold;
    font-size: 18px;
}
.kit_p03{
    font-size: 23px;
    font-weight: bold;
}

/* common用 */

.nt_cap_area{
    background-image: url(../img/common/info_bg.jpg);
}
.caption_box {
    max-width: 1200px;
    margin: auto;
    padding: 60px 10px 50px;
}
.caption_box p{
    font-size: 12px;
    padding-left: 1em;
    text-indent: -1em;
    margin-bottom: 6px;
}
.bnr_flex{
    align-items: center;
    margin: 60px auto;
    display: flex;
}
.bnr_flex li {
    margin: 0 10px;
}

.top_el{
    position: absolute;
}
.top_el img{
    width: auto;
}

.el01{
    bottom: -14%;
    left: 10%;
}
.el01 img{
    height: 9vw;
    max-height: 90px;
}

.el02{
    bottom: -14%;
    left: 10%;
}
.el02 img{
    height: 9vw;
    max-height: 90px;
}

.el03{
    bottom: -14%;
    left: 30%;
}
.el03 img{
    height: 9vw;
    max-height: 90px;
}

.el04{
    bottom: -14%;
    left: 24%;
}
.el04 img{
    height: 9vw;
    max-height: 90px;
}

.el05{
    bottom: -14%;
    left: 24%;
}
.el05 img{
    height: 9vw;
    max-height: 90px;
}


/* slider */

.slick-dotted.slick-slider {
    margin-bottom: 0;
}
#slider .slick-dots {
    bottom: 0px;
}
#slider .slick-dots li button:before {
    font-size: 10px;
}
#slider .slick-dots li button:before {
    color: #524837;
    opacity: 0.5;
}
#slider .slick-dots li.slick-active button:before {
    opacity: 1;
    color: rgb(255 241 4);
}




.emblem_img {
    position: absolute;
    top: -48%;
    left: 110px;
    transform: translate(0 , -50%);
    max-width: 250px;
}
@media screen and (max-width: 1500px){
    .emblem_img {
        left: 20px;
    }
}
@media screen and (max-width: 1130px){
    .emblem_img {
        top: -40%;
        left: 0%;
        max-width: 200px;
    }
}
@media screen and (max-width: 1000px){
    .info_txt p{
        font-size: 34px;
    }
    /* .info_txt p.normal {
        font-size: 18px;
        margin-bottom: 20px;
    } */

    .info_ttl{
        height: 24px;
    }
    .info_txt .normal .info_ttl {
        margin-bottom: 15px;
        height: unset;
    }
    .info_txt .normal p.lead {
        font-size: 20px;
    }

    .kit_p01{
        font-size: 18px;
    }

    .kit_p02{
        font-size: 16px;
    }

    .kit_p03 {
        font-size: 20px;
    }


    .top_introduction {
        display: flex;
        flex-wrap: wrap;
        position: relative;
        z-index: 1;
    }

    .intro_box {
        width: 100%;
        text-align: center;
    }

    .intro_ttl {
        max-width: 280px;
    }
    
    .intro_text_box p {
        line-height: 2;
        margin-top: 20px;
    }
    .forones_ttl p{
        line-height: 1;
        margin: 0;
    }
    
    .intro_text_box {
        padding: 20px 30px 70px 30px;
    }
    
    .videobox{
        width:100%;              /*横幅いっぱいにwidthを指定*/
        padding-bottom: 56.25%;  /*高さをpaddingで指定(16:9)*/
        height:0px;              /*高さはpaddingで指定するためheightは0に*/
        position: relative;
        display: contents;
    }
    
    .intro_box iframe {
        width: 100%;
        height: 360px;
    }
}
@media screen and (max-width: 900px){
    .emblem_img {
        top: -30%;
        left: 0%;
        max-width: 170px;
    }
}
@media screen and (max-width: 650px){
    .feature_box {
        padding: 30px 20px;
        height: auto;
    }
    .info_ttl{
        margin-bottom: 30px;
    }

    .info_ttl p{
        font-size: 18px;
    }

    .info_txt p{
        font-size: 24px;
    }

    .bnr_info{
        margin: 40px auto 60px;
    }


    .kit_p01{
        font-size: 18px;
    }
    .kit_p02 {
        font-size: 16px;
    }
    .kit_p03 {
        font-size: 18px;
    }

    .content_txt{
        width: 100%;
        order: 2;
        margin-top: 40px;
    }
    .content_links li{
        margin-bottom: 60px;
    }
    .content_links li:last-of-type{
        margin-bottom: 100px;
    }
    .content_img{
        width: 100%;
    }

    .panorama-bnr .ttl { 
        font-size:18px; 
    }
    .panorama-bnr ul { 
        display:block;
        margin-top:20px; 
    }
    .panorama-bnr ul li { 
        width:100%; 
    }
    .panorama-bnr ul li:last-child { 
        margin-top:30px; 
    }

    .intro_box iframe {
        height: 300px;
    }

    .top_introduction{
        margin: 0px auto 60px;
    }



    .bnr_info_boxup{
        margin: 60px auto;
    }  

    .bnr_flex {
        flex-wrap: wrap;
        margin-bottom: 0;
    }
    .bnr_flex li{
        width: 100%;
        max-width: 300px;
        margin: 10px;
    }
    .bnr_info_box{
        max-width: 370px;
        margin: 30px auto 0;
    }

    .el01{
        bottom: -7%;
    }
    .el01 img{
        height: 12vw;
    }

    .el02{
        bottom: -11%;
        left: 28%;
    }
    .el02 img{
        height: 12vw;
    }

    .el03{
        bottom: -11%;
    }
    .el03 img{
        height: 12vw;
    }

    .el04{
        bottom: -13%;
        left: 32%;
    }
    .el04 img{
        height: 12vw;
    }

    .el05{
        bottom: -11%;
        left: 31%;
    }
    .el05 img{
        height: 12vw;
    }
    .emblem_img {
        top: -10%;
        left: 2%;
        max-width: 120px;
    }
    /* .info_txt p.normal {
        font-size: 18px;
        margin-bottom: 15px;
    } */
    .info_txt .normal p.lead {
        font-size: 18px;
    }
    .info_txt .normal p.lead span {
        line-height: 1.5;
    } 
	.intro_box{
    width: 50%;
    text-align: center;
}

}

/* 臨時休業　20240313 */
.info-winter {
    padding: 20px;
    border: solid 1px #333;
    margin-top: 40px;
    background-color: #fff;
}
.info-winter p {
    text-align: center;
}
.info-winter p.b {
    font-size: 24px;
}
.info-winter p.m {
    margin: 10px 0;
    font-size: 18px;
}
.info-winter p.c {
    font-size: 14px;
}


/*  */
.bnr_info.contact {
    max-width: unset;
}
.bnr_info {
    width: 100%;
    max-width: 480px;
    margin: 60px auto 100px;
}


.raijo_bnr{
    /* max-width: 734px; */
    margin: 30px auto 0;
    transition: 0.3s;
}
.raijo_bnr:hover{
    opacity: 0.8;
    transition: 0.3s;
}

.festa_bnr{
    /* max-width: 734px; */
    margin: 30px auto 50px;
    transition: 0.3s;
}
.festa_bnr:hover{
    opacity: 0.8;
    transition: 0.3s;
}



@media screen and (max-width: 1000px){
    .info-winter p.b {
        font-size: 18px;
    }
    .info-winter p.m {
        font-size: 16px;
        line-height: 1.4;
    }
    .info-winter p.c {
        font-size: 14px;
    }
}
@media screen and (max-width: 650px){
    .info-winter p.b {
        font-size: 16px;
    }
    .info-winter p.m {
        font-size: 14px;
    }
    .info-winter p.c {
        font-size: 12px;
    }
    .raijo_bnr{
        max-width: 480px;
    }
    .bnr_info {
        margin: 40px auto 60px;
    }
    .emblem_img.db650 {
        position: unset;
        display: block;
        transform: unset;
        margin: 20px auto 0;
    }
	.info_txt .normal .info_ttl {
		margin-bottom: 0;
	}
	.info_txt .normal p.lead span {
        font-size: 20px;
    }
    
    .info_txt .normal2 p.lead {
        font-size: 17px;
    } 
    
    .info_txt .normal2 p.lead span {
        font-size: 15px;
    } 
    
}