@charset "UTF-8";
/* CSS Document */


@media screen and (min-width: 0px) and (max-width: 960px) {

.ind-wrap {
    width: 98%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 60px 0;
}

.btn {
    width: 100%;
    max-width: 320px;
    margin: 0 auto 20px;
    padding: 0;
    position: relative;
    background-color: #006EBD;
}
.b-red { background-color: #DC000B; }
.b-green { background-color: #01A040; }
.b-blue { background-color: #006EBD; }
.b-lblue { background-color:#059FE3; }
.b-orange { background-color: #EE7701; }
.b-dorange { background-color: #E84527; }
.b-pink { background-color: #EA5099; }


.hero-img {
    display: none !important;
}

.hero-sp {
    display: block !important;
    width: 100%;
    margin: 70px 0 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    line-height: 70%;
}


/***IMPORTANT NEWS***/

.important-news {
    width: 100%;
    margin: 0;
    padding: 10px 0 20px;
    position: relative;
    overflow: hidden;
    background-color: #DC000B;
}

.important-news .flex {
    width: 95%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.important-news .flex .label {
    width: 100%;
    margin: 0 0 10px;
    font-size: 120%;
    font-family: "M PLUS Rounded 1c", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*
.important-news .flex .label:before {
    content: "";
    width: 20px;
    height: 20px;
    margin: 0 10px 0 0;
    display: inline-block;
    background-image: url("../img/index/icon_importantnews.svg");
    background-repeat: no-repeat;
    background-size: contain;
}
*/

.important-news .flex .news-area {
    width: 100%;
    padding: 10px 0;
    background-color: #FFF;
    border-radius: 10px;
}

.news-area ul.imp-news {
    width: 90%;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

.news-area ul.imp-news a {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    text-decoration: none;
    color: #000;
}

.news-area ul.imp-news a .date {
    width: 100%;
    font-size: 80%;
}

.news-area ul.imp-news a .title {
    width: 100%;
}

/***PICKUP***/

section.pickup-sec {
    background-image: url("../img/index/pickup_bk.svg");
    background-repeat: repeat;
    background-size: contain;
}

section.pickup-sec .mds {
    width: 50%;
    max-width: 400px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    overflow: hidden;
    z-index: 10;
}

section.pickup-sec .pickup-bar {
    width: 95%;
    max-width: 1200px;
    margin: -30px auto 0;
    padding: 60px 0;
    position: relative;
    overflow: visible;
    background-color: #006EBD;
    border: solid 3px #000;
    border-radius: 20px;
}

section.pickup-sec .pickup-car {
    width: 90%;
    margin: 0 auto;
    overflow: visible;
    display: flex;
    justify-content: space-between;
}

section.pickup-sec .pickup-car .slick-slide {
    margin: 0 10px;
    border: solid 3px #000;
    line-height: 70%;
    border-radius: 10px;
}

section.pickup-sec .pickup-car > div img {
    border-radius: 7px;
}


/***YANASE YELLOW***/

section.yanase-sec {
    padding: 100px 0;
    background-image: url("../img/index/yanase_bk.svg");
    background-size: cover;
    background-repeat: no-repeat;
}

section.yanase-sec .ind-wrap {
    background-color: #FFF;
    border-radius: 30px;
    padding: 100px 0 100px;
}

.kaimaku {
    width: 80%;
    max-width: 1000px;
    margin: -150px auto 30px;
}

.kaimaku-wrap {
    width: 85%;
    margin: 0 auto 60px;
    padding: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    flex-direction: column-reverse;
}

.kaimaku-wrap .km-l {
    width: 100%;
    margin: 0;
}

.kaimaku-wrap .km-l p.txt {
    margin: 0 0 60px;
    font-size: 90%;
    line-height: 220%;
}

.kaimaku-wrap .km-r {
    width: 100%;
    margin: 0 0 30px;
}

.bnr-imada {
    width: 95%;
    max-width: 500px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    overflow: hidden;
}
.bnr-imada a {
    display: block;
    width: 100%;
    height: 100%;
    transition: all 0.3s;
}
.bnr-imada a:hover {
    opacity: 0.5;
}

.bnr-imada-pc {
    display: none;
}

.bnr-imada-sp {
    display: block;
}

/***ABOUT SECTION***/

section.about-sec {
    background-color: #FFF;
    overflow: visible;
}

section.about-sec .about-img {
    position: absolute;
    z-index: 10;
}

section.about-sec .mountain1 {
    width:35%;
    max-width: 300px;
    top: -20px;
    left: 0;   
}
section.about-sec .mountain2 {
    width:50%;
    max-width: 350px;
    top: 460px;
    right: -2%;   
}
section.about-sec .leaves {
    width:20%;
    max-width: 80px;
    top: 470px;
    right: 5%;   
}
section.about-sec .waterfall {
    width:70%;
    max-width: 550px;
    top: 350px;
    left: -2%;   
}

.about-flex {
    width: 95%;
    max-width: 1200px;
    margin: 0 auto 50px;
    padding: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.about-flex .about-l {    
    width: 80%;
    margin: 50px auto 200px;
}

.about-flex .about-r {    
    width: 90%;
    max-width: 600px;
    margin: 0 auto;
    font-size: 100%;
    line-height: 210%;
}

/***SANSHI***/

.sanshi-area {
    width: 100%;
    max-width: 1200px;
    margin: 100px auto 0;
    padding: 150px 0;
    position: relative;
    overflow: visible;
    
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 0;
}

section.about-sec .couple {
    width:13%;
    max-width: 100px;
    top: -100px;
    right: 5%;   
}


section.about-sec .temple {
    width:60%;
    max-width: 300px;
    top: -50px;
    left: -10%;   
}

section.about-sec .unagi {
    width:70%;
    max-width: 500px;
    top: 70px;
    right: -5%; 
}

section.about-sec .oyako1 {
    width:40%;
    max-width: 100px;
    top: 400px;
    left: -2%; 
}

section.about-sec .oyako2 {
    width:20%;
    max-width: 150px;
    top: 500px;
    right: -2%; 
}

.sanshi-area .txt {
    width: 80%;
    margin: 0 auto;
    padding: 100px 0;
    text-align: center;
    font-size: 90%;
    line-height: 210%;
}

.sanshi-area ul.sanshi-list {
    width: 70%;
    margin: 0 auto;
    padding: 0;
    position: relative;
    overflow: hidden;
    list-style: none;
    display: block;
}

.sanshi-area ul.sanshi-list li {
    width: 100%;
    margin: 0 0 30px;
}
.sanshi-area ul.sanshi-list li:last-child {
    margin: 0;
}

.sanshi-area ul.sanshi-list li a {
    width: 100%;
    height: 100%;
    display: block;
    transition: all 0.3s;
}
.sanshi-area ul.sanshi-list li a:hover {
    opacity: 0.5;
}


/***BEST SECTION***/

section.best-sec {
    padding: 0 0 60px;
    overflow: visible;
    
    background-size: cover;
    background-repeat: no-repeat;
}

section.best-sec .best-img {
    position: absolute;
    z-index: 10;
}

section.best-sec .oyako3 {
    width:18%;
    max-width: 100px;
    top: -40px;
    left: 2%;   
}
section.best-sec .bus {
    width:20%;
    max-width: 150px;
    top: -30px;
    right: 1%;   
}
section.best-sec .otter {
    width:20%;
    max-width: 150px;
    bottom: 10px;
    left: 5%;   
}
section.best-sec .couple2 {
    width:15%;
    max-width: 100px;
    bottom: 10px;
    right: 5%;   
}

h3.best-mds {
    width: 100%;
    margin: 0 0 30px;
    padding: 0;
    position: relative;
    overflow: hidden;
    text-align: center;
    font-size: 280%;
    line-height: 120%;
    font-family: "M PLUS Rounded 1c", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #006EBD;
}

section.best-sec .txt {
    margin: 0 0 50px;
    text-align: center;
}

ul.best-list {
    width: 90%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    overflow: hidden;
    list-style: none;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0;
}

ul.best-list li {
    width: 45%;
    margin: 0 0 60px;
    text-align: center;
}

ul.best-list li a {
    width: 100%;
    height: 100%;
    display: block;
    color: #000;
    text-decoration: none;
}

ul.best-list li .img {
    width: 90%;
    max-width: 300px;
    margin: 0 auto;
}

ul.best-list li .name {
    width: 100%;
    margin: -20px 0 0;
    color: #006EBD;
    font-size: 120%;
    line-height: 110%;
    font-family: "M PLUS Rounded 1c", sans-serif;
    font-weight: 700;
    font-style: normal;
}

/***TOPICS AND EVENTS SECTION***/

section.news-sec {
    padding: 100px 0;
/*
    background-image: url("../img/index/news_bk.jpg");
    background-repeat: repeat-y;
    background-size: 100%;
*/
    overflow: visible;
}

section.news-sec .ind-wrap {
    width: 88%;
    margin: 0 auto 100px;
    padding: 8px;
    overflow: visible;
    background-image: url("../img/index/news_wrap-bk.svg");
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 30px;
}

section.news-sec .ind-wrap .news-wrap {
    width: 90%;
    margin: 0 auto;
    padding: 60px 5%;
    position: relative;
    overflow: visible;
    background-color: #FFF;
    border-radius: 20px;
}

section.news-sec h2.news-mds {
    width: 100%;
    margin: 0 0 30px;
    font-size: 200%;
    line-height: 120%;
    font-family: "M PLUS Rounded 1c", sans-serif;
    font-weight: 700;
    font-style: normal;
}

section.news-sec h2.news-mds:before {
    content: "";
    width: 40px;
    height: 25px;
    display: inline-block;
    margin: 0 10px 0 0;
    background-size: contain;
    background-repeat: no-repeat;
}

section.news-sec h2.topics-mds:before {
    background-image: url("../img/index/news_heart-topics.svg");
}

section.news-sec h2.topics-mds {
    color: #EA5099;
}

section.news-sec h2.events-mds:before {
    background-image: url("../img/index/news_heart-events.svg");
}

section.news-sec h2.events-mds {
    color: #006EBD;
}

/***COURSE SECTION***/

section.course-sec {
    clip-path: inset(0);
    width: 100%;
    height: auto;
    box-sizing:border-box;
}

section.course-sec:after {
    content: '';
  position: fixed;
  top: 0;
  left: 0;
  z-index: -10;
  width:100%;
  height:100%;
  background-image: url("../img/index/course_bk.svg");
  background-size: contain;
  background-repeat: repeat-y;
}

.course-mds {
    width: 90%;
    margin: 0 auto 30px;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.course-sub-mds {
    width: 80%;
    max-width: 400px;
    margin: 0 auto 60px;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.course-txt {
    font-size: 110%;
    text-align: center;
    margin: 0 0 60px;
}



/***GUIDE SECTION***/

.guide-flex {
    width: 80%;
    max-width: 500px;
    margin: 0 auto 60px;
    padding: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.guide-flex .guide-bnr {
    width: 100%;
    margin: 0 0 10px;
}

.guide-flex .guide-bnr a {
    width: 100%;
    height: 100%;
    display: block;
    transition: all 0.3s;
}

.guide-flex .guide-bnr a:hover {
    opacity: 0.5;
}

/***SUPPORTER***/

.supporter-box {
    width: 90%;
    max-width: 1000px;
    margin: 0 auto 100px;
    padding: 30px 0;
    position: relative;
    overflow: hidden;
    border: solid 5px #EE7701;
    border-radius: 30px;
}

h3.supporter-mds {
    width: 100%;
    font-size: 180%;
    line-height: 160%;
    font-family: "M PLUS Rounded 1c", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #000;
    text-align: center;
}
h3.supporter-mds:before {
    content: "";
    width: 60%;
    height: 80px;
    display: block;
    margin: 0 auto 10px;
    background-image: url("../img/index/supporter_logo.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.supporter-flex {
    width: 90%;
    margin: 0 auto 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.supporter-flex .img {
    width: 80%;
    margin: 0 auto 30px;
}

.supporter-flex .txt {
    width: 100%;
    line-height: 240%;
}

/***OSHIRASE SNS***/

.sub-info-flex {
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sub-info-flex .sub-info {
    width: 100%;
    margin: 0 0 60px;
    border-radius: 30px;
}

.sub-info-flex .sub-info:last-child {
    margin: 0;
}

.sub-info-flex .sub-info .mds { 
    width: 90%;
    margin: 0 auto;
    padding: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 180%;
    font-weight: 700;
    
}

.sub-info-flex .oshirase-area {
    padding: 0 0 20px;
    background-color: #EE7701;
}

.oshirase-area .mds {
    color: #FFF;
}

.oshirase-area .oshirase-btn {
    width: 40%;
    background-color: #FFF;
    border-radius: 30px;
    font-size: 50%;
    
}
.oshirase-area .oshirase-btn a {
    width: 100%;
    display: block;
    text-align: center;
    color: #E84527;
    text-decoration: none;
}

.oshirase {
    width: 80%;
    margin: 0 auto 20px;
    padding: 30px 5%;
    background-color: #FFF;
    border-radius: 20px;
}

.sub-info-flex .sns {
    border: dashed 2px #E84527;
}

.sub-info-flex .sns .mds {
    color: #E84527;
}

.sub-info-flex .sns .mds span {
    width: 60%; 
    font-size: 55%;
    line-height: 180%;
    font-weight: 500;
    color: #000;
}

/***LNKS SECTION***/

section.link-sec {
    background-color: #F5F5F5;
    margin: 0 0 100px;
}

ul.links-list {
    width: 70%;
    margin: 0 auto;
    padding: 0;
    position: relative;
    overflow: hidden;
    list-style: none;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0;
}

ul.links-list li {
    width: 100%;
    margin: 0 0 10px;
}
ul.links-list li:last-child {
    margin: 0;
}

ul.links-list li a {
    width: 100%;
    height: 100%;
    display: block;
    transition: all 0.3s;
    line-height: 70%;
}

ul.links-list li a:hover {
    opacity: 0.5;
}

/***VIDEO***/

.douga-area {
    width: 100%;
    margin: 0 auto 60px;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.videobox {
    width: 80%;
    max-width: 800px;
    margin: 0 auto 30px;
    overflow: visible;
}

.video {
    aspect-ratio: 16 / 9;
    width: 100%;
}

/***kansha banner***/

section.kansha-sec .ind-wrap {
    padding: 30px 0 60px;
}

.kansha-bnr {
    width: 90%;
    margin: 0 auto 30px;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.kb-pc {
    display: none;
}

.kb-sp {
    display: block;
}

.kansha-bnr a {
    width: 100%;
    margin: 0;
    display: block;
}



}