@charset "UTF-8";

/*-----------------------------
	
    2020 会員登録
    
------------------------------*/
img{
    vertical-align: top;
}
strong {
    font-weight: bold;
}

.touroku_block a {
    color: #3872B8;
    text-decoration: underline;
}

.no-touch .touroku_block a:hover {
    text-decoration: none;
}

#touroku_head {
    width: 100%;
    background-image: url("../img/bg_touroku.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

#touroku_head > .content {
    height: 480px;
}

#touroku_head > .content > .inner {
    display: table;
    max-width: 1080px;
    margin: 0 auto;
    height: 100%;
    padding: 0 10px;
}

#touroku_head > .content > .inner > .caption {
    display: table-cell;
    vertical-align: middle;
}

#touroku_head > .content > .inner > .caption .main-txt {
    background-color: #FFF;
    text-align: center;
    padding: 30px 40px;
    border-radius: 10px;
    border: 4px solid #f74122;
}

.main-txt .intro1 {
    font-size: 1.8rem;
    font-weight: bold;
}



.price {
    margin-top: 20px;
    font-weight: bold;
    color: #f74122;
}

.price > .top_cap {
    font-size: 2rem;
    padding-right: 0.4em;
}

.price > .main {
    font-size: 6.4rem;
    line-height: 1;
    letter-spacing: 0.03em;
}

.price > .main i {
    margin-right: 0.1em;
    font-size: 5.4rem
}

.price > .small {
    font-size: 2rem;
    padding-left: 0.3em;
}

.price > .x-small {
    font-size: 1.3rem;
}

.main-txt .intro2 {
    font-size: 1.8rem;
    font-weight: bold;
    margin-top: 20px;
}

.price > .normal {
    font-size: 2rem;
    color: #333;
}

.main-txt .bikou {
    font-size: 1.5rem;
    margin-top: 15px;
}

br.-is-sp {
    display: none;
}



.touroku_block {
    padding-top:40px;
    font-size: 1.4rem;
}

.touroku_block .section + .section {
    margin-top: 60px;
}


ul.card_list {
    width: 100%;
    margin-top: 15px;
}

ul.card_list:after {
    content: '';
    display: block;
    clear: both;
}

ul.card_list > li {
    float: left;
    width: 20%;
    padding: 10px;
    text-align: center;
}

ul.card_list > li img {
    vertical-align: top;
    max-width: 90px;
    width: 100%;
}

ul.card_list > li .content {
    border:1px solid #CCC;
    border-radius: 6px;
    padding: 15px 10px;

}

ul.card_list > li .caption {
    font-size: 1.3rem;
    font-weight: bold;
    margin-top:8px;
}

#sample .link_block {
    margin-top: 30px;
}

#sample .link_block > ul > li a {
    padding: 12px 8px;
    font-size: 1.4rem;
    text-decoration: none;
}

.link_block > ul > li a.sample {
    color: #FFF;
    background-color: #088011;
    border: 1px solid #03670A;
    box-shadow: 0 1px 4px 1px rgba(0,0,0,0.2);
    -webkit-transition:0.3s ease;
  	-moz-transition:0.3s ease;
  	transition:0.3s ease;
}

.no-touch .link_block > ul > li a.sample:hover {
    background-color: #12691a;
    border: 1px solid #035008;
    color: #FFF;
}

.link_block > ul > li a.sample i {
    color: #FFF;
}


.terms_block {
    background-color: #f5f5f5;
    padding: 15px;
    font-size: 1.3rem;
}

.terms_block .term_title {
    font-size: 1.4rem;
    font-weight: bold;
    margin: 20px 0 10px;
}
.terms_block .term_title.mt0{
    margin-top: 0;
}

.terms_block ul.note_list > li > .inner > span.cap {
    padding-right: 0.4em;
}


.btn-def.touroku a {
    color: #FFF;
    background-color: #e43168;
    text-decoration: none;
}

.campaign > .content {
    max-width: 1080px;
    margin: 0 auto;
    text-align: center;
}

.campaign > .content > .caption {
    font-size: 2rem;
    font-weight: bold;
    color: #000;
}

.campaign > .content > .caption .day {
    display: block;
    margin-bottom: 20px
}
.campaign > .content > .caption .day span {
    display: inline-block;
    background-color: #1eac2f;
    color: #FFF;
    font-size: 2rem;
    padding: 10px;
}

.campaign > .content > .caption .cp_txt {
    margin-left: 10px;
}

.campaign > .content > .caption .cp_txt span {
    display: inline-block;
    font-size: 3.6rem;
    background-color: #fbff43;
    background: linear-gradient(transparent 65%, #fbff43 35%);
    padding: 5px;
    color: #dc0c0c;
}

.campaign > .content > .link_btn {
    margin-top: 30px;
}

.campaign>.content>.link_btn a {
    display: block;
    text-decoration: none;
    background-color: #22b8c7;
    max-width: 580px;
    margin: 0 auto;
    font-size: 2.2rem;
    font-weight: bold;
    color: #FFF;
    padding: 15px 10px;
    border-radius: 8px;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    transition: 0.3s ease;
}
.no-touch .campaign > .content > .link_btn a:hover {
    background-color: #189aa7;

}


.campaign .section_title {
    background-color: #286fab;
    margin-bottom: 0;
}

.campaign .section_title span.block {
    display: block;
    margin-bottom: 5px;
}

.campaign .section_title span.strong {
    color: #ecf104;
}

.campaign .section_title span.txt-sm {
    font-size: 1.6rem;
    margin-left: 0.5em;
}


.campaign .caps {
    text-align: left;
    line-height: 1.6;
    background-color: #f7f7f7;
    padding: 20px;
    border: 1px solid #ddd;
    border-top: none;
}

/* - 2025 キャンペーン　画像横並び
-------------------------------------------------- */

.img_unit {
    padding: 20px;
    border-radius: 12px;
    background: #e5f6df;
}

.img_unit .content {
    display: grid;
    grid-template-columns:  auto minmax(160px, 1fr);
    grid-template-columns:  auto min-content;
    justify-content: center;
    align-items: center;
    gap: 16px;
    margin-top: 16px;
}

.img_unit .title {
    font-size: clamp(2.2rem, 1.6318rem + 1.5152vw, 2.6rem);
    font-weight: bold;
    display: grid;
    justify-content: center;
    inline-size: fit-content;
    width: 100%;
    color: #cc0000;
}

.img_unit .txt {
    font-size: clamp(1.6rem, 1.3159rem + 0.7576vw, 1.8rem);
}

.img_unit .content .title + p {
    margin-top: 15px;
}

.img_unit .content .txt {
    text-align: left;
}

.img_unit .content .img img {
    /* max-width: 160px; */
    /* width: max(160px,50%); */
    width: clamp(160px, 80vw, 200px);
    min-width: 160px;
    /* min-width: 100px; */
    object-fit: contain;
}

/* - 2023 秋季キャンペーン
---------------------------- */

.section.anniversary{
    width: 100%;
    background-image: url("../img/bg_cp20.jpg");
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
    padding: 20px;
}

.section.anniversary h2{
    color: #24246e;
    font-size: 2.4rem;
    font-weight: bold;
    text-align: center;
}

.section.anniversary p{
    margin-bottom: 15px;
    font-size: 1.6rem;
}

.section.anniversary ul{
    font-size: 1.5rem;
}

.section.anniversary .banner{
    text-align: center;
    margin-top: 15px;
}

.section.anniversary .banner img{
    width: 100%;
    max-width: 500px;
    height: auto;
}

.section.anniversary .btn-def a {
    color: #e1c46a;
    background-color: #005d00;
    text-decoration: none;
    max-width: 500px;
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
}

.section.anniversary .btn-def a span span {
    display: block;
}
.section.anniversary .btn-def a:after{
    display: none;
}

.no-touch .section.anniversary .btn-def a:hover {
    background-color: #12691a;
    color: #FFF;
}

@media screen and (max-width: 639px){

#touroku_head > .content {
    height: 400px;
}

#touroku_head > .content > .inner > .caption .main-txt {
    padding: 20px;
}

.main-txt .intro1 {
    font-size: 1.6rem;
}

.main-txt .intro2 {
    font-size: 1.6rem;
}

.price > .top_cap {
    font-size: 1.8rem;
}

.price > .main {
    font-size: 5.4rem;
}


.price > .small {
    font-size: 1.8rem;
}

br.-is-sp {
    display: block;
}

ul.card_list > li {
    padding: 5px;
}



/* - 2025 キャンペーン　画像横並び
-------------------------------------------------- */
.img_unit .content {
    grid-template-columns: auto ;
}

}

@media screen and (max-width: 479px){
.section.anniversary .btn-def a {
    font-size: 1.6rem;
}

.touroku_block .section + .section {
    margin-top: 50px;
}

ul.card_list > li {
    width: 25%;
}

ul.card_list > li .content {
    padding: 10px 5px;
}


 /* - 無料キャンペーン
    ---------------------------- */



    .campaign > .content > .caption {
        font-size: 1.6rem;
        font-weight: bold;
    }

    .campaign > .content > .caption .day {
        display: block;
        margin-bottom: 20px
    }
    .campaign > .content > .caption .day span {
        font-size: 2.0rem;
        padding: 8px;
    }

    .campaign > .content > .caption .cp_txt {
        margin-left: 0;
        display: block;
        margin-top: 5px;
    }

    .campaign > .content > .caption .cp_txt span {
        font-size: 2.8rem;
    }

    .campaign > .content > .link_btn {
        margin-top: 25px;
    }

    .campaign > .content > .link_btn a {
        font-size: 2rem;
        padding: 12px 10px;
        border-radius: 8px;
    }



.campaign .section_title span.txt-sm {
    display: block;
}

.campaign .caps {
    padding: 15px;
}

 /* - 2023 秋季キャンペーン
    ---------------------------- */

.section.anniversary{
    padding: 20px 15px;
}

.section.anniversary h2{
    font-size: 1.9rem;
}

.section.anniversary p{
    font-size: 1.4rem;
}

.section.anniversary .btn-def a {

    display: block;
    align-items: center;
    justify-content: center;
}
.section.anniversary .btn-def a span{
    display: block;
    margin-top: 8px;
}

}

@media screen and (max-width: 359px){

.campaign > .content > .caption .cp_txt span {
    font-size: 2.2rem;
}

#touroku_head > .content > .inner > .caption .main-txt {
    padding: 20px 10px;
}

}

