@charset "UTF-8";
/* lead */
#lead {
    position: relative;
    padding: 15vw 0 1vw;
}
#lead::before {
    content: "";
    background: url("../img/course/lead_deco1.png") no-repeat;
    width: 100%;
    height: 90vw;
    position: absolute;
    top: 0;
    left: -35%;
    background-size: 100%;
    z-index: -1;
}
#lead::after {
    content: "";
    background: url("../img/course/lead_deco2.png") no-repeat;
    width: 100%;
    height: 100vw;
    position: absolute;
    top: -26vw;
    right: -15%;
    background-size: 100%;
    z-index: -1;
}
#lead h2 {
    font-size: 13vw;
    text-align: right;
    line-height: 1.2;
    margin-bottom: 6vw;
    color: #5f461c;
}
#lead h3 {
    text-align: right;
    line-height: 1.5;
    margin-bottom: 11vw;
    font-size: 7vw;
    position: relative;
    z-index: 3;
}
#lead h3 span{
    color:#fff;
}
#lead .photo {
    width: 50%;
    margin: -25vw 0 5vw -5%;
     z-index: 0;
    position: relative;
}
#lead .row .photo2 {
    margin: 0vw -5% 6vw;
    z-index: 1;
}
#lead .row .txt {
    margin-bottom: 6vw;
}
@media only screen and (min-width: 768px) {
    #lead {
        padding: 100px 0 20px;
    }
    #lead .wrap {
        width: 1240px;
        padding: 0 20px;
    }
    #lead::before {
        width: 854px;
        height: 900px;
        left: calc(50% - 210px);
        top: -235px;
    }
    #lead::after {
        top: -310px;
        right: auto;
        width: 653px;
        height: 650px;
        left: calc(50% - -300px);
    }
    #lead h2 {
        font-size: 92px;
        margin-bottom: 40px;
        letter-spacing: 3px;
        z-index: 5;
        position: relative;
    }
    #lead h2 .white {
        color: #fff;
    }
    #lead h3 {
        margin-bottom: 60px;
        font-size: 40px;
        margin-left: auto;
        width: 454px;
        text-align: left;
        line-height: 64px;
        letter-spacing: 1px;
    }
    #lead h3 span{
    color:#000;
}
    #lead .photo {
        margin: 0;
        width: auto;
        position: absolute;
        left: calc(50% - 50vw);
        top: -42px;
        right: 662px;
        height: 1106px;
    }
    #lead .row {
        width: 550px;
        margin-left: auto;
    }
    #lead .row .photo2 {
        margin: 0;
        margin-bottom: 79px;
        margin-right: -80px;
    }
    #lead .row .txt {
        margin-bottom: 20px;
        width: 482px;
        margin-left: 10px;
    }
}


/* anni */
#anni {
    position: relative;
    padding: 15vw 0 6vw;
}
#anni::before {
    content: "";
    background: url("../img/course/anni_deco2.png") no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 64vw;
    z-index: -1;
    background-size: 100%;
}
#anni::after {
    content: "";
    background: url("../img/shared/bg4.jpg") repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 11%;
    height: 33vw;
    z-index: -1;
}
#anni h2 {
    font-size: 10vw;
    text-align: center;
    line-height: 13vw;
    color: #673E0F;
    margin-bottom: 6vw;
    position: relative;
}
#anni h2::after {
    content: "";
    position: absolute;
    bottom: 2vw;
    left: 0;
    right: 0;
    height: 1px;
    background: #673E0F;
}
#anni .txt {
    margin-bottom: 4vw;
}
#anni .note{
    font-size:80%;
    line-height:180%;
     margin-bottom: 4vw;
}
#anni .js {
    margin-left: 2%;
    margin: 0 -11% 6vw 1%;
}
#anni .js .slick-dots {
    flex-direction: column;
    display: flex !important;
    top: 0;
    left: -9%;
}
#anni .row {
    position: relative;
    margin-top: 10vw;
}
#anni .row::before {
    content: "";
    background: url("../img/course/anni_deco2.png") no-repeat;
    position: absolute;
    top: -6vw;
    left: -15%;
    width: 100%;
    height: 60vw;
    z-index: -1;
    background-size: 100%;
}
#anni .row .deco {
    margin-bottom: -3vw;
}
#anni .row .col h3 {
    margin-bottom: 4vw;
    font-size: 5vw;
    text-align: right;
    line-height: 1.1;
}
#anni .row .col h3 span {
    font-size: 12vw;
    color: #673E0F;
    margin-bottom: -2vw;
    display: block;
    font-family: 'Playfair Display';
    font-weight: 500;
}
#anni .row .col .price{
    text-align: right;
    margin-bottom: 4vw;
    font-weight: 500;
    font-size:20px;
}
@media only screen and (max-width: 767px) {
	#anni .row .deco {
    margin: 0 -19% -6vw -15%;
}
}
@media only screen and (min-width: 768px) {
    #anni {
        padding: 130px 0 40px;
    }
    #anni .wrap {
        width: 1410px;
        padding: 0 20px;
    }
    #anni::before {
        width: 1131px;
        top: 980px;
        left: calc(50% + -230px);
        opacity: 0;
    }
    #anni::after {
        width: calc(50% - 638px);
        top: -130px;
        height: 670px;
    }
    #anni h2 {
        font-size: 62px;
        line-height: normal;
        margin-bottom: 40px;
        text-align: left;
        width: 450px;
        letter-spacing: 3px;
    }
    #anni h2 span {
        color: #fff;
        margin-right: 12px;
    }
    #anni h2::after {
        border-width: 2px;
        bottom: 15px;
        height: 2px;
        left: calc(50% - 50vw);
        right: -10px;
    }
    #anni .txt {
        margin-bottom: 40px;
        width: 352px;
        margin-left: 118px;
    }
    #anni .js {
        margin-left: 20px;
        margin: 0;
        position: absolute;
        top: -20px;
        left: 580px;
        right: calc(50% - 50vw);
    }
    #anni .js .ob {
        height: 878px;
    }
    #anni .js .slick-dots {
        left: -32px;
    }
    #anni .row {
        margin-top: 103px;
        display: flex;
        flex-direction: row-reverse;
    }
    #anni .row::before {
        width: 1131px;
        left: calc(50% - 240px);
        top: -340px;
    }
    #anni .row .deco {
        margin-bottom: -20px;
        margin-top: -80px;
        margin-right: -71px;
    }
    #anni .row .col h3 {
        margin-bottom: 20px;
        font-size: 24px;
        letter-spacing: 2px;
        margin-right: 20px;
        line-height: 50px;
    }
    #anni .row .col h3 span {
        font-size: 60px;
        margin-bottom: -20px;
    }
    #anni .row .col .price{
    margin-right: 30px;
    margin-bottom: 30px;
    }
    #anni .row .col .txt {
        margin-left: 0;
        width: 480px;
        margin-right: -21px;
        margin-bottom:20px;
    }
    #anni .note{
        margin-bottom:40px;
}
    #anni .box-shared {
        margin-left: 20px
    }
}
@media only screen and (min-width: 768px) and (max-width: 1423px) {
	#anni::after{
		width: 66px;
	}
}

/* box-shared */
.box-shared {
    position: relative;
    padding: 15vw 5% 15vw;
    background: url("../img/shared/bg6.jpg") repeat;
}
.box-shared::before {
    position: absolute;
    content: "";
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border: 1px solid #87735D;
}
.box-shared .price {
    text-align: center;
    position: relative;
    padding-top: 20px;
    margin-bottom: 7vw;
}
.box-shared .price::before {
    content: "";
    background: url("../img/course/anni_deco1.png") no-repeat;
    position: absolute;
    top: -7px;
    left: 0;
    width: 46px;
    height: 15px;
    margin: 0 auto;
    background-size: 100%;
    right: 0;
}
.box-shared .price dt {
    font-size: 25px;
    margin-bottom: 4vw;
}
.box-shared .price dt small {
    font-size: 18px;
}
.box-shared .price dd {
    font-size: 15px;
}
.box-shared .price dd span {
    font-size: 20px;
    margin-left: 3%;
    font-weight: 500;
    font-family: 'Zen Kaku Gothic New';
}
.box-shared .price dd small {
    font-size: 16px;
    font-family: 'Zen Kaku Gothic New';
    font-weight: 500;
}
.box-shared ul li {
    padding-left: 20px;
    position: relative;
    font-family: 'Zen Kaku Gothic New';
    font-weight: 500;
}
.box-shared ul li::before {
    position: absolute;
    content: "・";
    left: 0;
    top: 0;
}
.box-shared ul li small {
    font-size: 12px;
    line-height: 25px;
    display: inline-block;
}
.reserve-shared {
    border: 3px solid #7F5E3E;
    padding: 10vw 1%;
    background: url("../img/shared/bg6.jpg") repeat;
    margin: 0 5%;
    box-shadow: 10px 10px 0px #A16F3D;
    margin-bottom: 10vw;
}
.reserve-shared .box {
    flex-direction: column;
}
.reserve-shared .box h2 {
    font-size: 4vw;
    margin-bottom: 6vw;
    text-align: center;
}
.reserve-shared .box h2 span {
    font-size: 10vw;
    line-height: 1.6;
    margin-bottom: 6vw;
    color: #673e0f;
}
.reserve-shared .box .col .row .tel {
    margin-bottom: 7vw;
    text-align: center;
}
.reserve-shared .box .col .row .tel dt {
    font-size: 4vw;
    margin-bottom: 2vw;
}
.reserve-shared .box .col .row .tel dd {
    font-size: 9vw;
}
.reserve-shared .box .col .row .tel dd .tel-icon {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
    justify-content: center;
}
.reserve-shared .box .col .row .tel dd .tel-icon span {
    width: 7%;
}
.reserve-shared .box .col .row .btn-web {
    margin-bottom: 11vw;
}
.reserve-shared .box .col .txt {
    padding-left: 20px;
    border-left: 1px solid #1d170e;
}
@media only screen and (min-width: 768px) {
    .box-shared {
        padding: 62px 20px 71px;
        width: 594px;
    }
    .box-shared::before {
        top: 20px;
        left: 20px;
        right: 20px;
        bottom: 20px;
    }
    .box-shared .price {
        margin-bottom: 40px;
        padding-top: 40px;
    }
    .box-shared .price::before {
        width: 72px;
        height: 16px;
    }
    .box-shared .price dt {
        font-size: 30px;
        margin-bottom: 31px;
    }
    .box-shared .price dt small {
        font-size: 24px;
    }
    .box-shared .price dd {
        font-size: 18px;
    }
    .box-shared .price dd span {
        font-size: 26px;
        margin-left: 10px;
    }
    .box-shared .price dd small {
        font-size: 16px;
    }
    .box-shared ul {
        width: 441px;
        margin: 0 auto;
    }
    .box-shared ul li {
        font-size: 20px;
        line-height: 30px;
        margin-bottom: 10px;
    }
    .box-shared ul li small {
        font-size: 16px;
    }
    .reserve-shared {
        padding: 70px 20px 100px;
        margin-bottom: 20px;
        margin: 0 20px 0;
        box-shadow: 10px 16px 0px #A16F3D;
        max-width: 1464px;
        margin: 0 auto 20px;
    }
    .reserve-shared .wrap {
        width: 1240px;
        padding: 0 20px;
    }
    .reserve-shared .box {
        flex-direction: row;
        justify-content: space-between;
    }
    .reserve-shared .box h2 {
        font-size: 16px;
        margin-bottom: 20px;
        letter-spacing: 2px;
        width: 304px;
        text-align: left;
    }
    .reserve-shared .box h2 span {
        font-size: 50px;
        margin-bottom: 20px;
        letter-spacing: 0px;
    }
    .reserve-shared .box .col .row .tel {
        margin-bottom: 20px;
        text-align: left;
    }
    .reserve-shared .box .col .row .tel dt {
        font-size: 21px;
        margin-bottom: 20px;
    }
    .reserve-shared .box .col .row .tel dd {
        font-size: 52px;
    }
    .reserve-shared .box .col .row .btn-web {
        margin-bottom: 20px;
        width: 340px;
        margin-top: 10px;
    }
    .reserve-shared .box .col .row .btn-web a {
        padding: 30px;
        font-size: 24px;
    }
    .reserve-shared .box .col {
        width: 770px;
        margin-top: 18px;
    }
    .reserve-shared .box .col .row {
        display: flex;
        margin-bottom: 36px;
    }
    .reserve-shared .box .col .txt {
        margin-left: 10px;
        padding-left: 50px;
        font-size: 18px;
    }
}


/* party */
#party {
    position: relative;
    padding: 15vw 0 15vw;
}
#party::before {
    content: "";
    background: url("../img/course/party_deco1.png") no-repeat;
    width: 100%;
    height: 100vw;
    position: absolute;
    top: 0;
    left: -15%;
    background-size: 100%;
    z-index: -1;
}
#party::after {
    content: "";
    background: url("../img/shared/bg4.jpg") repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 17%;
    height: 55vw;
    z-index: -1;
}
#party h2 {
    font-size: 10vw;
    text-align: center;
    line-height: 1.6;
    color: #6C4415;
    margin-bottom: 9vw;
    position: relative;
}
#party h2 .line1 {
    position: relative;
}
#party h2 .line1::after {
    content: "";
    position: absolute;
    bottom: 2.2vw;
    left: -55%;
    right: 0;
    height: 1px;
    background: #5f461c;
}
#party h2 .line1 > span {
    position: relative;
}
#party h2 .line2 {
    margin-left: 2%;
}
#party h2 small {
    font-size: 5vw;
    color: #000;
}
#party .js {
    margin: 0 -11% 6vw 1%;
}
#party .js .slick-dots {
    flex-direction: column;
    display: flex !important;
    top: 0;
    left: -9%;
}
#party .txt {
    margin-bottom: 6vw;
}
#party .row .box-shared {
    margin-bottom: 6vw;
}
#party .deco {
    position: absolute;
    left: 0;
    bottom: -8vw;
    z-index: -1;
}
#party .row .note{
    font-size:13px;
    line-height:180%;
    padding:5vw 2vw 0;
}
@media only screen and (min-width: 768px) {
    #party {
        padding: 241px 0 116px;
    }
    #party .wrap {
        width: 1410px;
        padding: 0 20px;
    }
    #party::before {
        width: 653px;
        left: calc(50% + -960px);
        top: -50px;
    }
    #party::after {
        width: calc(50% - 638px);
        top: 151px;
    }
    #party h2 {
        font-size: 62px;
        margin-bottom: 35px;
        text-align: left;
        letter-spacing: 7px;
        line-height: 77px;
    }
    #party h2 .line1::after {
        height: 2px;
        left: calc(50% - 50vw);
        bottom: 14px;
        right: -230px;
    }
    #party h2 .line1 > span {
        color: #fff;
        margin-right: 10px;
    }
    #party h2 .line2 {
        margin-left: 72px;
        letter-spacing: 3px;
    }
    #party h2 small {
        font-size: 30px;
        margin-left: 130px;
        letter-spacing: 3px;
        margin-top: 30px;
        display: block;
    }
    #party .js {
        margin: 0;
        margin-left: 20px;
        margin: 0;
        position: absolute;
        top: -20px;
        left: 580px;
        right: calc(50% - 50vw);
    }
    #party .js .ob {
        height: 867px;
    }
    #party .js .slick-dots {
        left: -34px;
    }
    #party .txt {
        margin-bottom: 70px;
        margin-left: 137px;
        width: 361px;
    }
    #party .row .box-shared {
        margin-bottom: 20px;
    }
    #party .deco {
        bottom: -130px;
    }
    #party .row {
        display: flex;
        margin-left: 23px;
    }
    #party .row .box-shared:nth-child(2) {
        margin-top: 260px;
        margin-left: 60px;
    }
	#party .row .box-shared:nth-child(2) .txt2{
		    margin: 0 auto;
    		width: 440px;
	}
    #party .row .note{
        padding:20px 60px 0;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1423px) {
	#party::after{
		width: 66px;
	}
}

/* private */
#private {
    position: relative;
    padding: 20vw 0 20vw;
}
#private .js {
    margin-bottom: 6vw;
}
#private .js .ob {
    height: 70vw;
}
#private .box {
    margin: 0 5%;
    padding: 8% 5%;
    background: rgba(36, 19, 11, 0.9);
    color: #fff;
}
#private .box h2 {
    text-align: center;
    font-size: 6vw;
    margin-bottom: 6vw;
    line-height: 1.7;
    letter-spacing: 0.1em;
}
#private .box h2 span {
    color: #c5a178;
    font-size: 6vw;
    display: block;
    letter-spacing: 0.02em;
}
#private .box .txt {
    margin-bottom: 2vw;
}
#private .box .btn-cus a {
    background: none;
    border-bottom: 1px solid #fff;
    text-align: left;
    padding-left: 25px;
}
#private .box .btn-cus:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 1px;
    height: 20px;
    background: #fff;
}
@media only screen and (min-width: 768px) {
    #private {
        padding: 20px 0 0;
        margin-top: 110px;
        margin-bottom: -40px;
    }
    #private .js {
        margin-bottom: 20px;
    }
    #private .js .ob {
        height: 900px;
    }
    #private .box {
        position: absolute;
        top: 195px;
        left: 0;
        right: 0;
        margin: 0 auto;
        max-width: 691px;
        padding: 73px;
        box-sizing: border-box;
    }
    #private .box h2 {
        font-size: 30px;
        margin-bottom: 40px;
        line-height: 54px;
    }
    #private .box h2 span {
        font-size: 24px;
    }
    #private .box .txt {
        margin-bottom: 46px;
        text-align: center;
    }
    #private .box .btn-cus a {
        color: #fff;
        font-size: 18px;
    }
    #private .box .btn-cus a::after {
        filter: invert(1);
    }
    #private .box .btn-cus {
        width: 320px;
        margin: 0 auto;
    }
}