/* mainvisual */
#mainVisual{
    padding-top: 130px;
    position: relative;
    z-index: 3;
    }
#mainVisual ul{
    width: 98%;
    margin: auto;
    }
#mainVisual ul li img{
    width: 100%;
    max-width: 100%;
    border-radius: 30px;
    }
#title{
    position: absolute;
    width: 96%;
    max-width: 1160px;
    bottom: 5%;
    left: 0;
    right: 0;
    margin: auto;
    }

#title .cntText{
    display: flex;
    align-content: center;
    align-items: center;
    }
#title .cntText h2 {
    width: 70%;
    /* mix-blend-mode: exclusion; */
    }
#title .cntText .btn{width: 30%;}
#title .cntText .btn a{transition: .3s;}
#title .cntText .btn a:hover {animation: pulsation .7s alternate infinite;}
@keyframes pulsation {
  0% { transform: scale(1); }
  50% { transform: scale(0.9); }
  100% { transform: scale(1.1); }
}

@media screen and (max-width: 1290px) {
    #mainVisual{padding-top: 90px;}
    }
@media screen and (max-width: 1000px) {
    #mainVisual{padding-top: 70px;}    
    }
/* TAB */
@media screen and (max-width: 899px) {
    #mainVisual{padding-top: 50px;} 
    #mainVisual ul li img{border-radius: 20px;}
    }
/* SP */
@media screen and (max-width: 480px) {
    #mainVisual ul li img{border-radius: 10px;}
    }


/* mainBox
----------------------------------------------*/
#mainBox{
    margin-top: -230px;
    box-sizing: border-box;
    }
#mainBox .bg{
    background: url("../img/cmn/bg01.jpg")repeat center;
    border-radius: 40px;
    }
#mainBox p{
    font-size: 1.8rem;
    line-height: 1.7;
    font-weight: normal;
    }
/* TAB */
@media screen and (max-width: 899px) {
    #mainBox{margin-top: -120px;}
    #mainBox p{
    font-size: 1.6rem;
    line-height: 1.7;
    } 
    
}
/* SP */
@media screen and (max-width: 480px) {
    #mainBox{margin-top: -80px;}
    #mainBox .bg{border-radius: 20px;}
    #mainBox p{
    font-size: 1.4rem;
    line-height: 1.5;
    }
}

/* greeting */
#_greeting{
    width: 96%;
    margin: 0 0 0 auto;
    background: url("../img/top/intro_bg.png")no-repeat 50% 90% ,var(--c-main);
    padding-top: 230px;
    box-sizing: border-box;
    border-radius: 0 0 0 60px;
    color: #fff;
    position: relative;
    z-index: 1;
    }
#_greeting::after{
    position: absolute;
    content: "";
    background: url("../img/top/intro_img.png")no-repeat;
    background-size: cover;
    width: 35vw;
    height: 50vw;
    bottom: 5%;
    right: 0;
}
#_greeting .cntInner{
    padding: 150px 0 200px;
    position: relative;
    z-index: 2;
    }

#_greeting .cntInner p{
    /*font-size: 2.8rem;*/
    font-size: calc(100vw / 45);
    line-height: 1.6;
    font-weight: 800;
    padding: 25px 0;
    }
#_greeting .cntInner p span.last{
    left: 9em;
    position: absolute;
    }

@media screen and (max-width: 1080px) {
   #_greeting::after{
    background: url("../img/top/intro_img.png")no-repeat;
    background-size: contain;
    width: 440px;
    height: 600px;
    bottom: 10%;
    } 
}

/* TAB */
@media screen and (max-width: 899px) {
#_greeting{
    background: url("../img/top/intro_bg.png")no-repeat 70% 20% ,var(--c-main);
    background-size: 60%;
    padding-top: 80px;
    border-radius: 0 0 0 40px;
    }
#_greeting::after{display: none;}
#_greeting .cntInner{padding: 80px 0 30px;}
#_greeting .cntInner p{
    font-size: 2.0rem;
    padding: 15px 0;
    }
#_greeting .cntInner .cntImg{margin-top: 15px;}
}
/* SP */
@media screen and (max-width: 480px) {
 #_greeting{
    background: url("../img/top/intro_bg.png")no-repeat 80% 20% ,var(--c-main);
    background-size: 50%; 
    padding-top: 40px;
    border-radius: 0 0 0 20px;
    }
#_greeting .cntInner{padding: 80px 0 20px;}
#_greeting .cntInner p{
    font-size: 1.7rem;
    padding: 10px 0;
    }
}


/* news */
#_news .cntInner{
    padding: 160px 0 150px;
    max-width: 1280px;
    margin: auto;
    }
#_news .cntInner .cntList{align-items: center;}
#_news .cntInner .cntDiv{width: 30%;}
#_news .cntInner .cntDiv .cntBtn{max-width: 180px;}
#_news .cntInner .cntBox{width: 65%;}
#_news .cntInner .cntBox ul li{
    border-bottom: 2px solid #ddd;
    }
#_news .cntInner .cntBox ul li:last-child{border-bottom: none;}
#_news .cntInner .cntBox ul li a{
    display: block;
    width: 100%;
    padding: 30px 0;
    overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
    }
#_news .cntInner .cntBox ul li a span{
    font-family: var(--ff-en);
    font-weight: 400;
    letter-spacing: 0;
    color: #5b5b5b;
    margin-right: 40px;
    }


/* TAB */
@media screen and (max-width: 899px) {
    #_news .cntInner{padding: 80px 0;}
    #_news .cntInner .cntBox ul li a{
        padding: 20px 0;
        font-size: 1.5rem;
    }
}
/* SP */
@media screen and (max-width: 480px) {
    #_news .cntInner{padding: 40px 0;}
    #_news .cntInner .cntDiv{width: 100%;}
    #_news .cntInner .cntBox{width: 100%;margin-top: 20px;}
    #_news .cntInner .cntBox ul li a{
        padding: 10px 0;
        font-size: 1.4rem;
    }
}

/* know */
#_know{padding: 145px 0 180px}
#_know .cntBox{
    background: #333;
    color: #fff;
    /*width: 94%;*/
    border-radius:30px;
    margin: 0 auto;
    transition: all .3s ease-in-out;
    box-shadow: 0 0 0 rgba(0,0,0,.25);
    }
#_know .cntBox:hover{box-shadow: 0 0 10px rgba(0,0,0,.25);}
#_know .cntBox a{
    display: block;
    width: 100%;
    padding: 60px 45px;
    box-sizing: border-box;
    }

#_know .cntBox ._Title{margin-bottom: 70px;}
#_know .cntBox ._Title .ja{
    background: url("../img/cmn/arw01.png")no-repeat 96% 12px;
    padding-right: 45px;
    transition: all .3s ease-in-out;
    }
#_know .cntBox:hover ._Title .ja{background: url("../img/cmn/arw01.png")no-repeat 100% 12px;}
#_know .topBnr01{background: url("../img/top/bnr01_img.png")no-repeat top right , var(--c-main);}

#_know .cntList{
    /*width: 95%;*/
    padding: 50px 0;
    margin: 0 auto;
    }
#_know .cntList .cntBox{width: 49%;margin: 0;}
#_know .cntList ._Title .ja{background: url("../img/cmn/arw02.png")no-repeat 96% 12px;}
#_know .cntList .cntBox:hover ._Title .ja{background: url("../img/cmn/arw02.png")no-repeat 100% 12px;}

#_know .cntList p{color: #333;}
#_know .topBnr02{
    background:url("../img/top/bnr02_img.png")no-repeat 86% 18% , #e3fde5;
    color:var(--c-main);
    }

#_know .topBnr03{
    background: url("../img/top/bnr03_img.png")no-repeat top left ,#faff78;
    color:var(--c-main);
    }
#_know .topBnr03 ._Title{text-align: right;color: #333;}
#_know .topBnr03 p{
    text-align: right;
    text-shadow: 4px 0px 3px rgba(250, 255, 120, 1);
    }

#_know .topBnr04{background:url("../img/top/bnr04_img.png")no-repeat 30px center , #a4a4a4;}
#_know .topBnr04 ._Title{
    text-align: right;
    margin-bottom: 50px;
    }
#_know .topBnr04 ._Title .ja{background: url("../img/cmn/arw03.png")no-repeat 96% 12px;}
#_know .cntBox.topBnr04:hover ._Title .ja{background: url("../img/cmn/arw03.png")no-repeat 100% 12px;}
#_know .topBnr04 p{text-align: right;}

/* TAB */
@media screen and (max-width: 899px) {
#_know{padding: 80px 0}
#_know .cntBox{border-radius:20px;}
#_know .cntBox a{padding: 40px 25px;}
#_know .cntBox ._Title{margin-bottom: 40px;}
#_know .cntBox ._Title .ja{
    background: url("../img/cmn/arw01.png")no-repeat 96% 5px;
    background-size: 20px;
    padding-right: 35px;
    }
#_know .cntBox:hover ._Title .ja{
    background: url("../img/cmn/arw01.png")no-repeat 100% 5px;
    background-size: 20px;
    }
#_know .topBnr01{
    background: url("../img/top/bnr01_img.png")no-repeat top right , var(--c-main);
    background-size: contain;
    }
#_know .cntList{padding: 20px 0;}
#_know .cntList ._Title .ja{
    background: url("../img/cmn/arw02.png")no-repeat 96% 5px;
    background-size: 20px;
    }
#_know .cntList .cntBox{width: 100%;margin: 0 0 10px;}
#_know .cntList .cntBox:hover ._Title .ja{
    background: url("../img/cmn/arw02.png")no-repeat 100% 5px;
    background-size: 20px;
    }
    
#_know .topBnr02{
    background:url("../img/top/bnr02_img.png")no-repeat 86% 18% , #e3fde5;
    background-size: 30%;
    }
#_know .topBnr03{
    background: url("../img/top/bnr03_img.png")no-repeat top left ,#faff78;
    background-size: contain;
    }
#_know .topBnr04{
    background:url("../img/top/bnr04_img.png")no-repeat 10px center , #a4a4a4;
    background-size: 30%;
    }
#_know .topBnr04 ._Title .en{font-size: 5.0rem;}
#_know .topBnr04 ._Title .ja{
    background: url("../img/cmn/arw03.png")no-repeat 96% 5px;
    background-size: 20px;
    }
#_know .cntBox.topBnr04:hover ._Title .ja{
    background: url("../img/cmn/arw03.png")no-repeat 100% 5px;
    background-size: 20px;
    }

    
}
/* SP */
@media screen and (max-width: 480px) {
#_know{padding: 40px 0}
#_know .cntBox{border-radius:10px;}
#_know .cntBox ._Title .ja{
    background: url("../img/cmn/arw01.png")no-repeat 96% 2px;
    background-size: 15px;
    padding-right: 25px;
    }
#_know .cntBox:hover ._Title .ja{
    background: url("../img/cmn/arw01.png")no-repeat 100% 2px;
    background-size: 15px;
    }
#_know .topBnr01{
    background: url("../img/top/bnr01_img_sp.png")no-repeat top right , var(--c-main);
    background-size: 55%;
    }
#_know .cntList{padding: 10px 0 0;}

    
#_know .cntList ._Title .ja{
    background: url("../img/cmn/arw02.png")no-repeat 96% 2px;
    background-size: 15px;
    }
#_know .cntList .cntBox:hover ._Title .ja{
    background: url("../img/cmn/arw02.png")no-repeat 100% 2px;
    background-size: 15px;
    }
#_know .topBnr02{
    background:url("../img/top/bnr02_img.png")no-repeat 96% 18% , #e3fde5;
    background-size: 30%;
    }
#_know .topBnr04{
    background:url("../img/top/bnr04_img.png")no-repeat 10px 20px , #a4a4a4;
    background-size: 30%;
    }
#_know .topBnr04 ._Title .en{font-size: 3.0rem;}
#_know .topBnr04 ._Title .ja{
    background: url("../img/cmn/arw03.png")no-repeat 96% 2px;
    background-size: 15px;
    }
#_know .cntBox.topBnr04:hover ._Title .ja{
    background: url("../img/cmn/arw03.png")no-repeat 100% 2px;
    background-size: 15px;
    }
}


/* joinus */

#_joinus{
    background: url("../img/top/entry_bg.png")no-repeat center;
    background-size: cover;
    text-align: center;
    padding: 16% 0;
    border-radius:40px;
    overflow: hidden;
    }
#_joinus h3{
    font-size: 9.4rem;
    color: #fff;
    }
#_joinus p{
    font-size: 3.3rem;
    font-weight: 600;
    color: #fff;
    display: block;
    margin-bottom: 25px;
    }
#_joinus div a{
    display: block;
    width: 100%;
    font-size: 3.5rem;
    max-width:250px;
    padding: 5px 10px;
    text-align: center;
    margin: auto;
    color:var(--c-main);
    border-radius: 100px;
    background: url("../img/cmn/arw02.png")no-repeat 95% center , #fff;
    transition: .3s;
    }
#_joinus div a:hover {
    color: #fff;
    background: url("../img/cmn/arw01.png")no-repeat 95% center , var(--c-main);
    animation: pulsation .7s alternate infinite;
}

/* TAB */
@media screen and (max-width: 899px) {
#_joinus{
    padding: 12% 0;
    border-radius:30px;
    }
#_joinus h3{font-size: 5.4rem;}
#_joinus p{font-size: 2.0rem;}
#_joinus div a{font-size: 2.3rem;}
}
/* SP */
@media screen and (max-width: 480px) {
#_joinus{
    background: url("../img/top/entry_bg_sp.png")no-repeat center;
    background-size: cover;
    padding: 8% 0;
    border-radius:20px;
    } 
#_joinus h3{font-size: 3.3rem;}
#_joinus p{font-size: 1.6rem;}  
#_joinus div a{
    font-size: 2.0rem;
    padding: 8px 10px;
    }
}