/* lead */
#lead .set1 {
    position: relative;
    padding: 15vw 0 5vw;
}
#lead .set1::before {
    content: "";
    background: url("../img/course/lead_deco1.png") no-repeat;
    position: absolute;
    top: 179vw;
    right: 4%;
    width: 47vw;
    height: 73vw;
    background-size: 100%;
}
#lead .set1::after {
    content: "";
    position: absolute;
    background: url("../img/shared/bg2.jpg") repeat;
    top: 145vw;
    left: 0;
    width: 78%;
    height: 74vw;
    z-index: -1;
}
#lead .set1 .photo {
    height: 91vw;
    margin-bottom: 8vw;
}
#lead .set1 .photo img {
    object-position: bottom 31% left 0;
}
#lead .set1 .col .photo2 {
    margin-bottom: 11vw;
}
#lead .set1 .col h2 {
    width: 70%;
    margin-bottom: 6vw;
    margin-left: -2%;
}
#lead .set1 .col .txt {
    margin-bottom: 6vw;
}
#lead .set2 {
    position: relative;
    padding: 5vw 0 15vw;
}
#lead .set2::before {
    content: "";
    background: url("../img/course/lead_deco2.jpg") no-repeat;
    position: absolute;
    top: -13vw;
    left: 4%;
    width: 47vw;
    height: 73vw;
    background-size: 100%;
    z-index: -1;
}
#lead .set2 h3 {
    width: 34%;
    margin: 0 auto 21vw;
}
#lead .set2 .js {
    margin-bottom: 2vw;
}
#lead .set2 .js .slick-dots {
    top: -42px;
    bottom: auto;
}
.para {
    position: relative;
    height: 80vw;
}
@media only screen and (min-width: 768px) {
    #lead .wrap {
        width: 1200px;
        padding: 0 20px;
    }
    #lead .set1 {
        padding: 101px 0 20px;
    }
    #lead .set1::before {
        top: 440px;
        width: 362px;
        height: 303px;
        right: calc(50% - 740px);
    }
    #lead .set1::after {
        top: 392px;
        width: 420px;
        left: calc(50% - 150px);
        height: 350px;
    }
    #lead .set1 .photo {
        height: 643px;
        margin-bottom: 0;
        position: absolute;
        left: -75px;
        top: 35px;
        height: 892px;
    }
    #lead .set1 .photo img {
        object-position: center;
    }
    #lead .set1 .col {
        width: 519px;
        margin-left: auto;
    }
    #lead .set1 .col .photo2 {
        margin-bottom: 90px;
        margin-left: 72px;
        margin-right: -40px;
    }
    #lead .set1 .col h2 {
        margin-bottom: 73px;
        margin-left: 20px;
    }
    #lead .set1 .col .txt {
        margin-bottom: 20px;
        margin-left: 30px;
        width: 410px;
    }
    #lead .set2 {
        padding: 172px 0 170px;
    }
    #lead .set2::before {
        width: 516px;
        height: 335px;
        top: -50px;
        left: calc(50% - 514px);
    }
    #lead .set2 h3 {
        margin: 0;
        width: auto;
        margin-left: 110px;
        margin-bottom: 70px;
    }
    #lead .set2 .js {
        width: 798px;
        position: absolute;
        left: 470px;
        top: -61px;
    }
    #lead .set2 .js .slick-dots {
        top: -52px;
        left: 27px;
    }
    #lead .set2 .txt {
        width: 270px;
        margin-left: 70px;
    }
    .para {
        height: 700px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1200px) {
    #lead .set1 .photo {
        max-width: 54%;
    }
}


/* sushi */
#sushi {
    position: relative;
    padding: 15vw 0 5vw;
}
#sushi::before {
    content: "";
    background: url("../img/course/sushi_deco1.png") no-repeat;
    position: absolute;
    top: -3vw;
    right: 0;
    width: 67vw;
    height: 73vw;
    background-size: 100%;
}
#sushi h2 {
    text-align: center;
    margin-bottom: 13vw;
}
#sushi .price {
    text-align: center;
    position: relative;
    letter-spacing: 2px;
    margin-bottom: 5vw;
}
#sushi .price::before {
    content: "";
    position: absolute;
    top: -22%;
    left: 0;
    right: 0;
    width: 100px;
    height: 1px;
    background: #857D6E;
    margin: 0 auto;
}
#sushi .price dt {
    font-size: 8vw;
    text-align: center;
    margin-bottom: 3vw;
}
#sushi .price dd {
    font-size: 6vw;
    letter-spacing: 3px;
}
#sushi .price dd small {
    font-size: 5vw;
}
#sushi .note {
    text-align: center;
    margin-bottom: 10vw;
}
#sushi .box {
    padding: 5%;
    background: url("../img/course/bg3.jpg") repeat;
    margin-bottom: 10vw;
}
#sushi .box h3 {
    font-size: 20px;
    text-decoration: underline;
    margin-bottom: 4vw;
    text-align: center;
}
#sushi .box .list {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
     width:100%;
    margin:0 auto;
}
#sushi .box .list ul{
   width:40%;
}

#sushi .box .list li{
    width:100%;    
}
#sushi .box .note{
    font-size:2.5vw;
    margin-bottom:3vw;
}
#sushi .group-photo .photo {
    width: 90%;
    margin-bottom: 6vw;
}
#sushi .group-photo .row {
    justify-content: space-between;
    margin-bottom: 6vw;
}
#sushi .group-photo .row .photo1 {
    width: 48%;
}
#sushi .group-photo .row .photo2 {
    width: 48%;
}
#sushi .group-photo .row2 {
    justify-content: space-between;
    margin-bottom: 6vw;
}
#sushi .group-photo .row2 .photo3 {
    width: 48%;
}
#sushi .group-photo .row2 .photo4 {
    width: 48%;
}
#sushi .group-photo .photo5 {
    margin-bottom: 6vw;
}
#sushi .bnr {
    margin-bottom: 6vw;
}
@media only screen and (min-width: 768px) {
    #sushi {
        padding: 197px 0 79px;
    }
    #sushi .wrap {
        width: 1321px;
        padding: 0 20px;
    }
    #sushi::before {
        top: 0;
        width: 648px;
        height: 432px;
        right: -140px;
    }
    #sushi h2 {
        margin-bottom: 20px;
        text-align: left;
        padding-top: 38px;
        position: absolute;
        left: 20px;
        top: -90px;
    }
    #sushi .price {
        margin-bottom: 5px;
    }
    #sushi .price::before {
        top: -55px;
        height: 2px;
    }
    #sushi .price dt {
        font-size: 38px;
        margin-bottom: 20px;
    }
    #sushi .price dd {
        font-size: 30px;
    }
    #sushi .price dd small {
        font-size: 24px;
    }
    #sushi .note {
        margin-bottom: 120px;
        text-align: right;
        margin-right: 130px;
        font-size: 14px;
    }
    #sushi .box {
        padding: 29px;
        margin-bottom: -370px;
        margin-left: auto;
        width: 450px;
        margin-right: 50px;
        box-sizing: border-box;
    }
    #sushi .box h3 {
        font-size: 24px;
        margin-bottom: 20px;
    }
    #sushi .box .list {
        margin: 39px 0px;
        font-size: 20px;
    }
    #sushi .box .note{
        font-size:13px;
        text-align: center;
        line-height:160%;
        width:100%;
    }
    #sushi .group-photo .photo {
        margin-bottom: 90px;
        width: auto;
        margin-left: 100px;
        max-width: 48%;
    }
    #sushi .group-photo .row {
        margin: 0 -24px 23px;
    }
    #sushi .group-photo .row .photo2 {
        margin-top: 10px;
        margin-right: -28px;
        width: 660px;
    }
    #sushi .group-photo .row2 {
        margin-bottom: 84px;
    }
    #sushi .group-photo .row2 .photo4 {
        width: auto;
        margin-top: 60px;
        margin-right: -34px;
    }
    #sushi .group-photo .photo5 {
        margin: 0 40px 98px;
    }
    #sushi .bnr {
        margin-bottom: 20px;
        text-align: center;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1300px) {
    #sushi .group-photo .photo {
        max-width: 43%;
    }
    #sushi .group-photo .row .photo2 {
        max-width: 48%;
    }
    #sushi .group-photo .row2 .photo4 {
        max-width: 51%;
    }
}

/* bnr */
#bnr .bnr1 {
    position: relative;
    background: url("../img/course/bnr_bg1.jpg") no-repeat right 23% bottom 0;
    background-size: cover;
    padding: 10vw 0;
}
#bnr .bnr1 h2 {
    font-size: 6vw;
    margin-bottom: 6vw;
    width: 64%;
    margin-left: 5%;
}
#bnr .bnr1 .txt {
    color: #fff;
    padding: 0 5%;
    margin-bottom: 6vw;
    text-shadow: 0px 0px 20px #000, 0px 0px 20px #000;
}
#bnr .bnr1 .btn-cus a {
    color: #fff;
}
#bnr .bnr1 .btn-cus a span::before {
    background: #fff;
}
#bnr .bnr1 .btn-cus a::before {
    background: #fff;
}
#bnr .bnr1 .btn-cus a::after {
    filter: invert(1);
}
#bnr .gr-bnr {
    flex-direction: column;
}
#bnr .gr-bnr .bnr {
    position: relative;
}
#bnr .gr-bnr .bnr::after {
    content: "";
    position: absolute;
    background: url("../img/shared/bnr_arrow_on.png") no-repeat;
    right: 5%;
    bottom: 5%;
    width: 31px;
    height: 40px;
    background-size: 100%;
}
#bnr .gr-bnr .bnr .ttl {
    position: absolute;
    width: 64%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 5;
    top: 50%;
    transform: translateY(-50%);
}
@media only screen and (min-width: 768px) {
    #bnr .bnr1 {
        position: relative;
        background-size: cover;
        padding: 177px 0 136px;
    }
    #bnr .bnr1 h2 {
        margin-bottom: 40px;
        width: 64%;
        margin-left: 144px;
    }
    #bnr .bnr1 .txt {
        color: #fff;
        padding: 0 5%;
        margin-bottom: 50px;
        text-shadow: none;
        margin-left: 77px;
        width: 349px;
    }
    #bnr .bnr1 .btn-cus a {
        color: #fff;
    }
    #bnr .bnr1 .btn-cus a span::before {
        background: #fff;
    }
    #bnr .bnr1 .btn-cus a::before {
       	border: 1px solid #fff;
		background: no-repeat;
    }
    #bnr .bnr1 .btn-cus a::after {
        filter: invert(0);
    }
	#bnr .bnr1 .btn-cus a:hover::before{
		background: #fff;
	}
	 #bnr .bnr1 .btn-cus a:hover::after {
        filter: invert(1);
    }
    #bnr .gr-bnr {
        flex-direction: row;
    }
    #bnr .gr-bnr .bnr {
        position: relative;
        width: 50%;
    }
    #bnr .gr-bnr .bnr::after {
        content: "";
        position: absolute;
        background: url("../img/shared/bnr_arrow.png") no-repeat;
        right: 5%;
        bottom: 5%;
        width: 54px;
        height: 66px;
        background-size: 100%;
    }
    #bnr .gr-bnr .bnr:hover::after {
        background: url("../img/shared/bnr_arrow_on.png") no-repeat;
        right: 5%;
		transition: all 0.5s;
    }
    #bnr .gr-bnr .bnr .ttl {
        position: absolute;
        width: 460px;
        left: 0;
        right: 0;
        margin: 0 auto;
        z-index: 5;
        top: 171px;
        transform: none;
    }
	#bnr .gr-bnr .bnr .ttl img{
		opacity: 1;
	}
    #bnr .bnr1 .btn-cus {
        margin-left: 153px;
        margin-right: auto;
        width: 352px;
    }
    #bnr .gr-bnr .bnr .img {
        height: 502px;
    }
	#bnr .gr-bnr .bnr .img img{
		opacity: 1;
	}
    #bnr .gr-bnr .bnr:hover .img img {
        opacity: 1
    }
	#bnr .bnr1 .link{
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		text-indent: -9999px;
	}
	   #bnr .bnr1:hover .btn-cus a::before {
        background: #fff;
		transition: all 0.5s;
    }
	 #bnr .bnr1:hover .btn-cus a::after {
   		 filter: invert(1);
		 transition: all 0.5s;
	}
}