/* CSS common Document */

/* guide */

#guide{
    margin: 0 20px 0 20px;  
}

.guide_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
}

#guide h2{
    position: relative;
    color: #000;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 15px;
    padding-left: 14px;
    line-height: 1.4em;
}

#guide h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 2px;
    height: 100%;
    background: radial-gradient(circle, #EACDA3 0%, #E1AF6F 100%);
}

#guide .guide_inner h2{
    margin-top: 2em;
    font-family: "M PLUS 1", sans-serif !important;
}

#guide .guide_inner h2:first-of-type{
    margin-top: 0px;
}

/* customer_term */

#customer_term{
    margin: 0 20px 0 20px;
}

.customer_term_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
}

#customer_term h2{
    font-weight: 700;
    font-size: 16px;
    line-height: 1.4em;
    margin-bottom: 0.3em;
}

#customer_term .customer_term_inner h2{
    margin-top: 2em;
    font-family: "M PLUS 1", sans-serif;
}

#customer_term .customer_term_inner h2:first-of-type{
    margin-top: 0px;
}

#customer_term .customer_term_inner {
  counter-reset: section;
}

#customer_term .customer_term_inner h2 {
  counter-increment: section;
}

#customer_term .customer_term_inner h2::before {
  content: counter(section) ". ";
}

#customer_term .customer_term_ul1 > li{
    padding-left:1em;
    text-indent:-1em;
}

#customer_term .customer_term_ul1 > li > ul{
    padding-left: 1em;
}

/* information */

#information{
    margin: 0 20px 0 20px;
}

.information_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
    font-family: "M PLUS 1", sans-serif;
}

#information .c-pagination{
    margin-top: 50px;
}

#information .c-pagination ul{
    display: flex;
}

#information .c-pagination ul li span{
    color: #000000;
    opacity: 1;
}

#information .c-pagination ul li a{
    color: #666666;
}

#information .information_inner ul li{
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #EDEDED;
}

#information .information_inner ul li .top{
    display: flex;
    margin-bottom: 10px;
}

#information .information_inner ul li .top .date{
    font-size: 12px;
    color: #666666;
    margin-right: 10px;
}

#information .information_inner ul li .top .cate{
    font-size: 12px;
    color: #9B734E;
}

#information ul li a{
    transition: .4s;
}

@media (any-hover: hover) {
    #information ul li a:hover{
        opacity: 0.5;
    }
}


#information_detail{
    margin: 0 20px 0 20px;
}

.information_detail_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
    font-family: "M PLUS 1", sans-serif;
}

#information_detail .top{
    display: flex;
    margin-bottom: 10px;
}

#information_detail .top .date{
    font-size: 12px;
    color: #666666;
    margin-right: 10px;
}

#information_detail .top .cate{
    font-size: 12px;
    color: #9B734E;
}

#information_detail h1{
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 30px;
    border-bottom: 1px solid #EDEDED;
    margin-bottom: 30px;
}

#information_detail p{
    margin-bottom: 30px;
    line-height: 2em;
}

#information_detail h2{
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 15px;
    padding: 15px 15px 15px 30px;
    background-color: #000;
    color: #fff;
    position: relative;
}

#information_detail h2::before {
    content: "";
    position: absolute;
    left: 15px;
    top: 27px;
    transform: translateY(-50%);
    width: 2px;
    height: 1.2em;
    background: radial-gradient(circle, #EACDA3 0%, #E1AF6F 100%);
}

#information_detail h3{
    font-size: 16px;
    font-weight: 700;
    padding-left: 15px;
    margin-bottom: 15px;
    position: relative;
}

#information_detail h3::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 12px;
    transform: translateY(-50%);
    width: 2px;
    height: 1.2em;
    background: radial-gradient(circle, #EACDA3 0%, #E1AF6F 100%);
}

#information_detail h4{
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 15px;
}

#information_detail a{
    text-decoration: underline;
    transition: background-color 0.5s ease, opacity 0.5s ease; 
}

@media (any-hover: hover) {
    #information_detail a:hover{
        opacity: 0.5;
    }
}

#information_detail a.btn, #contact a.btn{
    padding: 15px 0 15px 0;
    text-align: center;
    width: 300px;
    background-color: #000;
    color: #fff;
    font-weight: 700;
    display: block;
    text-decoration: none;
}

#information_detail ul {
    list-style: none;
    padding-left: 1em;
}

#information_detail ul li::before {
    content: "・";
    display: inline-block;
    width: 1em;
    margin-left: -1em;
    color: #000;
}

#information_detail ol {
    list-style: decimal !important;
    padding-left: 1.5em;
}

#information_detail li {
    list-style: inherit !important;
    line-height: 1.4em;
    margin-bottom: 5px;
}

#information_detail li:last-child {
    margin-bottom: 0;
}

#information_detail .text{
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #EDEDED;
}

.article_btn_link_inner{
    display: flex;
    justify-content: space-between;
    max-width: 360px;
    margin: 50px auto 0 auto;
}

.article_btn_link_inner a{
    color: #000;
}

.article_btn_link_inner .article_prev{
    position: relative;
    padding-left: 20px;
}

.article_btn_link_inner .article_prev svg{
    position: absolute;
    top: 3px;
    left: 0;
    width: 9px;
}

.article_btn_link_inner .article_next{
    position: relative;
    padding-right: 20px;
}

.article_btn_link_inner .article_next svg{
    position: absolute;
    top: 3px;
    right: 0;
    width: 9px;
}

.is-inactive{
    opacity: 0 !important;
    pointer-events:none;
}

/* site_information */

#site_information{
    margin: 0 20px 0 20px;
}

.site_information_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
}

@media print, screen and (min-width: 720px) {
    #site_information .item{
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid #E5E5E5;
        display: flex;
    }
    
    #site_information .item dt{
        width: 170px;
        font-weight: 700;
    }
    
    #site_information .item dd{
        -webkit-flex: 1;
        flex: 1;
        line-height: 1.4em;
    }
}
@media print, screen and (max-width: 719px) {
    #site_information .item{
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid #E5E5E5;
    }
    
    #site_information .item dt{
        font-weight: 700;
        margin-bottom: 5px;
    }
    
    #site_information .item dd{
        -webkit-flex: 1;
        flex: 1;
        line-height: 1.4em;
    }
}

/* contact */

#contact{
    margin: 0 20px 0 20px;
}

.contact_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
}

#contact h2{
    position: relative;
    color: #000;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 15px;
    padding-left: 14px;
    line-height: 1.4em;
    font-family: "M PLUS 1", sans-serif !important;
}

#contact h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 2px;
    height: 100%;
    background: radial-gradient(circle, #EACDA3 0%, #E1AF6F 100%);
}

#contact .contact_inner h2{
    margin-top: 3em;
}

#contact .contact_inner h2:first-of-type{
    margin-top: 0px;
}

#contact p{
    margin-bottom: 20px;
}

#contact .text2{
    font-size: 12px;
    color: #666666;
}

#contact .title1{
    font-weight: 500;
    margin-bottom: 10px;
    font-size: 14px;
}

#contact .title2{
    margin-bottom: 20px;
}

#contact ul.ul1 li ul li{
    margin-left: 2em;
}

/* membership */

#membership{
    margin: 0 20px 0 20px;
}

.membership_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
}

#membership h2{
    position: relative;
    color: #000;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 15px;
    padding-left: 14px;
    line-height: 1.4em;
}

#membership h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 2px;
    height: 100%;
    background: radial-gradient(circle, #EACDA3 0%, #E1AF6F 100%);
}

#membership .membership_inner h2{
    margin-top: 3em;
    font-family: "M PLUS 1", sans-serif !important;
}

#membership .membership_inner h2:first-of-type{
    margin-top: 0px;
}

#membership p{
    margin-bottom: 20px;
}

#membership .text2{
    font-size: 12px;
    color: #666666;
}

#membership .title1{
    font-weight: 500;
    margin-bottom: 10px;
    font-size: 14px;
}

#membership .title2{
    margin-bottom: 20px;
}

#membership .title3{
    padding: 20px 10px 20px 10px;
    background-color: #000;
    font-weight: 700;
    color: #fff;
    font-size: 16px;
    margin-bottom: 0px;
}

#membership .box1 ul{
    display: flex;
    margin-bottom: 30px;
}

#membership .box1 ul li{
    margin-right: 25px;
}

#membership .box1 ul li:last-child{
    margin-right: 0;
}

#membership .box1 ul li .img{
    margin-bottom: 10px;
}

#membership .box1 ul li .title{
    text-align: center;
}

#membership ol{
    counter-reset: item;
    margin-left: 2em;
}

#membership ol li::before {
    counter-increment: item;
    content: counter(item) ".";
    display: inline-block;
    width: 2em;
    margin-left: -2em;
    text-align: right;
    padding-right: 0.5em;
}

/* privacypolicy */

#privacypolicy{
    margin: 0 20px 0 20px;
}

.privacypolicy_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
}

#privacypolicy h2{
    font-weight: 700;
    font-size: 16px;
    line-height: 1.4em;
    margin-bottom: 0.3em;
}

#privacypolicy .privacypolicy_inner h2{
    margin-top: 2em;
    font-family: "M PLUS 1", sans-serif !important;
}

#privacypolicy .privacypolicy_inner h2:first-of-type{
    margin-top: 0px;
}

#privacypolicy .privacypolicy_inner {
  counter-reset: section;
}

#privacypolicy .privacypolicy_inner h2:not(:first-of-type) {
  counter-increment: section;
}

#privacypolicy .privacypolicy_inner h2:first-of-type::before {
  content: "";
}

#privacypolicy .privacypolicy_inner h2:not(:first-of-type)::before {
  content: counter(section) ". ";
}

/* legalnotice */

#legalnotice{
    margin: 0 20px 0 20px;
}

.legalnotice_inner{
    max-width: 800px;
    margin: 0 auto 0 auto;
}

#legalnotice .bold{
    font-weight: 700;
}

#legalnotice p{
    line-height: 1.7em;
}

@media print, screen and (min-width: 720px) {
    #legalnotice .item{
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid #E5E5E5;
        display: flex;
    }
    
    #legalnotice .item dt{
        width: 170px;
        font-weight: 700;
    }
    
    #legalnotice .item dd{
        -webkit-flex: 1;
        flex: 1;
        line-height: 1.4em;
    }
}
@media print, screen and (max-width: 719px) {
    #legalnotice .item{
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid #E5E5E5;
    }
    
    #legalnotice .item dt{
        font-weight: 700;
        margin-bottom: 5px;
    }
    
    #legalnotice .item dd{
        -webkit-flex: 1;
        flex: 1;
        line-height: 1.4em;
    }
}

#sign_up {
	width: 100%;
	height: auto;
}
.sign_up__inner {
    width: 90%;
    max-width: 1000px;
    height: auto;
    margin: 0 auto;
}
.sign_up__contents {
    width: 100%;
    height: auto;
}
.sign_up__form_wrap {
    width: 100%;
    height: auto;
}
.sign_up__form._same_email {
    font-size: 14px;
    font-weight: 400;
    line-height: calc(22 / 14);
    letter-spacing: 0.05em;
    color: var(--color--black);
}
._same_email .mypage__form__list {
    margin-top: 20px;
}

/* password_reset */

#password_reset{
    margin: 0 20px 0 20px;  
}

.password_reset__inner{
    max-width: 600px;
    margin: 0 auto 0 auto;
}

.password_reset__contents__txt {
    width: 100%;
    height: auto;
    font-size: 14px;
    font-weight: 400;
    line-height: calc(24 / 14);
    letter-spacing: 0.05em;
    text-align: center;
    color: var(--color--black);
}
.password_reset__form_wrap {
    width: 100%;
    height: auto;
    margin: 50px auto 60px;
}
.password_reset__link {
    width: 100%;
    height: auto;
    margin: 15px auto 0;
    font-size: 12px;
    font-weight: 400;
    line-height: calc(14 / 12);
    letter-spacing: 0.05em;
    text-align: center;
}
.password_reset__link a {
    color: var(--color--gray2);
    text-decoration: underline;
}
@media (any-hover: hover) {
    .password_reset__link a:hover {
        text-decoration: none;
    }
}
.password_reset__contents__note {
    width: 100%;
    height: auto;
    font-size: 14px;
    font-weight: 400;
    line-height: calc(24 / 14);
    letter-spacing: 0.05em;
    text-align: center;
    color: var(--color--black);
}

/* top */

#index-view{
    font-family: "M PLUS 1", sans-serif;
    margin-top: 100px;
}

#index-view #top1{
    margin-bottom: 100px;
}

#index-view #top2{
    margin-bottom: 100px;
}

#index-view #top3{
    margin-bottom: 100px;
}

#index-view #top4{
    margin-bottom: 100px;
}

#top4{
    position: relative;
}

#top4 .swiper-pagination2{
    position: absolute;
    bottom: -40px !important;
    text-align: center;
}

#top4 .swiper-pagination-bullet {
  background-color: #111 !important;
  height: 3px !important;
  width: 30px !important;
  border-radius: 0 !important;
}

#index-view #top5{
    margin: 0 20px 100px 20px;
}

#index-view #top6{
    margin-bottom: 100px;
}

#index-view #top7{
    margin-bottom: 100px;
}

#index-view #top8{
    margin-bottom: 150px;
}

#index-view #top9{
    margin: 0 20px 150px 20px;
}

#index-view #top10{
    margin-bottom: 110px;
}

#index-view #top11{
    margin: 0 20px 0 20px;
}

#index-view .products_details_top_box_btn1{
    max-width: 300px;
    margin: 50px auto 0 auto;
}

#header__news{
    background-color: #000;
    text-align: center;
    padding: 15px;
}

#header__news a{
    color: #fff;                
    line-height: 1;
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: .4s;
}

@media print, screen and (max-width: 719px) {
    #header__news a{
        font-size: 12px;
    }
}

@media (any-hover: hover) {
    #header__news a:hover{
        opacity: 0.5;
    }
}

#header.top_header {
  margin-top: 60px;
  transition: margin-top 0.35s ease;
}

#header.top_header.is-scrolled {
  margin-top: 20px;
}

#top .swiper-pagination{
    position: absolute;
    bottom: -40px !important;
}

#top .swiper-pagination-bullet {
  background-color: #111 !important;
  height: 3px !important;
  width: 30px !important;
  border-radius: 0 !important;
}

#top .slider-thumbnail .swiper-slide {
  opacity: .5;
  transition: opacity .5s;
  width: calc(100% / 3);
}
#top .slider-thumbnail .swiper-slide.swiper-slide-thumb-active {
  opacity: 1;
}

@media print, screen and (min-width: 720px) {
    #top .slider .sp_img{
        display: none;
    }
}

@media print, screen and (max-width: 719px) {
    #top .slider .pc_img{
        display: none;
    }
}

#top .swiper-slide img {
  height: auto;
  width: 100%;
}

.ranking .ranking_inner{
    max-width: 1000px;
    margin: 0 auto 0 auto;
}

.ranking .p-product_list{
    padding: 0;
}

@media (min-width: 720px) {
    .ranking .p-product_list{
        column-gap:20px;
    }
}

@media (max-width: 719px) {
    .ranking .products__list__item {
        width: 100%;
    }
}

.ranking .products__list__item{
    position: relative;
}

.ranking .products__list__item .rank{
    position: absolute;
    top: 10px;
    left: 10px;
    width: 25px;
    height: 25px;
    line-height: 25px;
    color: #666;
    background-color: #E5E5E5;
    display: block;
    font-weight: 500;
    text-align: center;
    z-index: 1;
}

.ranking .products__list__item .rank.rank1{
    color: #fff;
    background-color: #CBA65C;
}

.ranking .products__list__item .rank.rank2{
    color: #fff;
    background-color: #AAAAAA;
}

.ranking .products__list__item .rank.rank3{
    color: #fff;
    background-color: #B39579;
}

.include_list_item .new_list{
    position: relative;
}

.include_list_item .new_list .new_icon{
    color: #fff;
    position: absolute;
    z-index: 1;
    padding: 5px 5px 8px 5px;
    line-height: 1;
    font-size: 10px;
    background-color: #000;
    top: 10px;
    left: 10px;
}

@media print, screen and (min-width: 720px) {
    #top2{
        background-color: #F7F7F7;
        padding: 50px 20px 50px 20px;
    }

    .top_tab_area{
        max-width: 1000px;
        margin: 0 auto 0 auto;
        display: flex;
        flex-wrap: wrap;
    }

    .top_tab_area .top_tab_category{
        width: 200px;
        margin-right: 50px;
    }

    .top_tab_area .top_tab_contents{
        -webkit-flex: 1;
        flex: 1;
    }

    .top_tab_area .top_tab_category ul li{
        padding: 15px;
        color: #B7B7B7;
        border-bottom: 1px solid #B7B7B7;
        margin-bottom: 15px;
        font-family: "Oswald";
        font-size: 16px;
        font-weight: 700;
        text-align: center;
        cursor: pointer;
        transition: .4s;
    }

    .top_tab_area .top_tab_category ul li.select{
        padding: 15px;
        color: #000;
        border-bottom: 1px solid #CAA481;
        margin-bottom: 15px;
        font-family: "Oswald";
        font-size: 16px;
        font-weight: 700;
        text-align: center;
        cursor: pointer;
    }

    .top_tab_area .top_tab_contents ul > li > ul{
        display: flex;
        flex-wrap: wrap;
    }

    .top_tab_area .top_tab_contents ul > li > ul > li a{
        width: 140px;
        display: block;
        padding: 15px 0 15px 0;
        text-align: center;
        background-color: #fff;
        margin-right: 10px;
        margin-bottom: 10px;
        color: #A9A9A9;
        border: 1px solid #ECEAE8;
        box-sizing:border-box;
    }

    .top_tab_area .top_tab_contents ul > li > ul > li a .cate1{
        font-size: 12px;
        font-family: "Oswald";
        line-height: 1;
        margin-bottom: 7px;
    }

    .top_tab_area .top_tab_contents ul > li > ul > li a .cate2{
        line-height: 1;
        font-weight: 500;
    }
    
    @media (any-hover: hover) {
        .top_tab_area .top_tab_category ul li:hover{
            color: #000;
            border-bottom: 1px solid #CAA481;
        }

        .top_tab_area .top_tab_contents ul > li > ul > li a:hover{
            padding: 14px 0 14px 0;
            border: 2px solid #000;
            color: #000;
        }
    }
}

@media print, screen and (max-width: 719px) {
    #top2{
        background-color: #F7F7F7;
        padding: 20px 0px 50px 0px;
    }
    
    .top_tab_area .top_tab_category{
        margin-left: 20px;
    }

    .top_tab_area .top_tab_category ul{
        display: flex;
        justify-content: center;
    }

    .top_tab_area .top_tab_category ul li{
        width: 100px;
        padding: 15px;
        color: #B7B7B7;
        border-bottom: 1px solid #B7B7B7;
        margin-bottom: 15px;
        font-family: "Oswald";
        font-size: 16px;
        font-weight: 700;
        text-align: center;
        cursor: pointer;
        transition: .4s;
    }

    .top_tab_area .top_tab_category ul li.select{
        padding: 15px;
        color: #000;
        border-bottom: 3px solid #CAA481;
        margin-bottom: 15px;
        font-family: "Oswald";
        font-size: 16px;
        font-weight: 700;
        text-align: center;
        cursor: pointer;
    }
    
    .top_tab_area .top_tab_contents{
        margin: 0 20px 0 20px;
    }

    .top_tab_area .top_tab_contents ul > li > ul{
        display: flex;
        flex-wrap: wrap;
    }

    .top_tab_area .top_tab_contents ul > li > ul > li{
        width: 32%;
        margin-right: 2%;
        margin-bottom: 2%;
    }

    .top_tab_area .top_tab_contents ul > li > ul > li a{
        display: block;
        padding: 15px 0 15px 0;
        text-align: center;
        background-color: #fff;
        color: #A9A9A9;
        border: 1px solid #ECEAE8;
        box-sizing:border-box;
    }

    .top_tab_area .top_tab_contents ul > li > ul > li:nth-child(3n){
        margin-right: 0;
    }

    .top_tab_area .top_tab_contents ul > li > ul > li a .cate1{
        font-size: 12px;
        font-family: "Oswald";
        line-height: 1;
        margin-bottom: 7px;
    }

    .top_tab_area .top_tab_contents ul > li > ul > li a .cate2{
        line-height: 1;
        font-weight: 500;
    }
    
    @media (any-hover: hover) {
        .top_tab_area .top_tab_category ul li:hover{
            color: #000;
            border-bottom: 3px solid #CAA481;
        }

        .top_tab_area .top_tab_contents ul > li > ul > li a:hover{
            padding: 14px 0 14px 0;
            border: 2px solid #000;
            color: #000;
        }
    }
}

.top_tab_contents > ul > li {
    display: none;
    opacity: 0;
    transition: opacity .25s ease;
}
.top_tab_contents > ul > li.active {
    display: block;
}

.top_tab_contents > ul > li.fade-in {
    opacity: 1;
}

@media print, screen and (max-width: 719px) {

    .top_tab_area .top_tab_category {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .top_tab_area .top_tab_category::-webkit-scrollbar {
        display: none;
    }

    .top_tab_area .top_tab_category ul {
        display: flex;
        flex-wrap: nowrap;
        width: max-content;
    }

    .top_tab_area .top_tab_category ul li {
        flex-shrink: 0;
        width: auto;
        min-width: 100px;
        white-space: nowrap;
    }
}

#top4 .swiper-slide .box {
    position: relative;
    overflow: hidden;
}

#top4 .swiper-slide .img img {
    width: 100%;
    height: auto;
    display: block;
}

#top4 .swiper-slide .box::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.85);
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
}
#top4 .swiper-slide .text,
#top4 .swiper-slide .btn {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 10px);
    color: #fff;
    opacity: 0;
    z-index: 2;
    transition: opacity 0.3s ease, transform 0.3s ease;
    text-align: center;
}

#top4 .swiper-slide .text {
    top: 40%;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.5;
}

#top4 .swiper-slide .btn {
    top: 60%;
}

#top4 .swiper-slide .btn a {
    display: inline-block;
    padding: 10px 24px;
    border: 1px solid #fff;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    font-size: 14px;
}

#top4 .swiper-slide:hover .box::after {
    opacity: 1;
}

#top4 .swiper-slide:hover .text,
#top4 .swiper-slide:hover .btn {
    opacity: 1;
    transform: translate(-50%, 0);
}

.top_instagram .copy{
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    margin-top: 20px;
}
.insta_slider {
    overflow: hidden;
}

.insta_slider ul {
    display: flex;
    flex-wrap: nowrap;
}

.insta_slider li {
    width: 244px;
    margin-right: 30px;
    flex-shrink: 0;
}

.insta_slider li a{
    transition: .4s;
}

@media (any-hover: hover) {
    .insta_slider li a:hover{
        opacity: 0.5;
    }
}

.insta_slider img {
    display: block;
    width: 100%;
}


.top_message .top_message_inner .title{
   font-weight: 700;
   margin-bottom: 20px;
   font-size: 18px;
}

@media print, screen and (min-width: 720px) {
   .top_message .top_message_inner{
       max-width: 1070px;
       margin: 0 auto 0 auto;
       display: flex;
       align-items: center;
   }
   
   .top_message .top_message_inner .left{
        -webkit-flex: 1;
        flex: 1;
   }
   
   .top_message .top_message_inner .right{
       margin-left: 80px;
        width: 518px;
        position: relative;
        height: 400px;
   }
   
   .top_message .top_message_inner .right .img1{
       width: 272px;
       position: absolute;
       top: 0;
       left: 0;
   }
   
   .top_message .top_message_inner .right .img2{
       width: 220px;
       position: absolute;
       bottom: 0;
       right: 0;
   }
}

@media print, screen and (max-width: 719px) {
   
   .top_message .top_message_inner .left{
        margin-bottom: 20px;
   }
   
   .top_message .top_message_inner .right{
       position: relative;
       height: 140vw;
   }
   
   .top_message .top_message_inner .right .img1{
       position: absolute;
       width: 60%;
       z-index: 1;
   }
   
   .top_message .top_message_inner .right .img2{
       width: 50%;
       position: absolute;
       bottom: 0;
       right: 0;
   }
}