@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500;700;900&display=swap');



body {

    margin: 0;

}



/* ================================

  #main-content initialize

================================ */

#main-content *,

#main-content *::before,

#main-content *::after {

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    -ms-box-sizing: border-box;

    -o-box-sizing: border-box;

    box-sizing: border-box;

}



#main-content {

    display: block;

    color: #000;

    /* unique value */

    font-size: 14px;

    /*   jp_only   */

    font-family: "Helvetica", "Noto Sans TC", "Microsoft JhengHei", "微軟正黑體", "Arial", sans-serif;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



#main-content a {

    display: inline-block;

    color: #585858;

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

    -webkit-box-shadow: none;

    box-shadow: none;

    outline: none;

}



#main-content a:link,

#main-content a:visited,

#main-content a:active,

#main-content a:focus {

    color: #585858;

    text-decoration: none;    

}

#main-content a:hover {

    opacity: .65;

    transition: all .3s ease;

}



    



#main-content h1,

#main-content h2 {

    line-height: 1.4;

    /* unique value */

    margin: -.2em 0;

    /* unique value */

    padding: 0;

    /*   jp_only   */

    font-family: "Helvetica", "Noto Sans TC", "Microsoft JhengHei", "微軟正黑體", "Arial", sans-serif;

    font-weight: 700;

    text-rendering: optimizeLegibility;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



.privilege__ttl-1 {

    font-size: 30px;

    margin-bottom: 15px;



}



#main-content h3,

#main-content h4,

#main-content h5,

#main-content h6 {

    line-height: 1.4;

    /* unique value */

    margin: -.2em 0;

    /* unique value */

    padding: 0;

}



#main-content p {

    /* unique value */

    line-height: 1.8;

    /* unique value */

    margin: -.4em 0;

    /* unique value */

    padding: 0;



    font-size: 1.4rem;

}



#main-content img {

    width: 100%;

    font-size: .5em;

    vertical-align: bottom;

}



#main-content dl,

#main-content dd,

#main-content dt,

#main-content ol,

#main-content ul,

#main-content li {

    margin: 0;

    padding: 0;

    list-style: none;

}



#main-content figure,

#main-content figcaption {

    margin: 0;

    padding: 0;

}



#main-content del,

#main-content ins {

    text-decoration: none;

}



#main-content *.price__wrap {}



#main-content *.price__wrap.price-review {}



#main-content *.price {

    display: block;

    color: #000;

    font-size: 15px;

}



#main-content *.oldprice {

    display: block;

    color: #585858;

    font-size: 10px;

    line-height: 1;

    margin-bottom: 1em;

}



#main-content *.oldprice::after {

    content: '→';

    font-size: 14px;

    margin-left: .286em;

}



#main-content *.num {

    font-family: "Helvetica", sans-serif;

    font-weight: bold;

}



#main-content *.price *.num {

    font-size:26px;

    line-height: 1;

    margin: 0 .1em;

}



#main-content *.oldprice *.num {

    font-size: 16px;

    margin: 0 .2em;

}



#main-content *.thumb {

    display: block;

}



#main-content *.name {

    display: block;

    color: #000;

    font-size: 20px;

    line-height: 1.5;

    margin-top: 0px;

    margin-bottom: 5px;

    font-weight: 700;

}



#main-content *.size {

    display: block;

    font-family: "Helvetica", sans-serif;

    color: #999;

    font-size: 12px;

    line-height: 1;

}



/* add sale banner*/



#main-content *.sale {

    display: block;

    margin-top: 10px;

    font-size: 14px;

    line-height: 1;

}



#main-content *.sale a {

    display: block;

    padding: 5px;

    color: #7F0019;

    border: 1px solid #CBCBCB;

    -moz-border-radius: 2px;

    -webkit-border-radius: 2px;

    border-radius: 2px;

}



#main-content *.sale *.sale-date {

    color: #585858;

}

#main-content .common__title {

    color: #000;

    font-size: 24px;

    font-weight: bold;

    line-height: 1.5;

    margin-bottom: 15px;

    }



#main-content .common__txt {

    display: block;

    color: #000;

    font-size: 18px;

    line-height: 1.6;

    margin-bottom: 15px;

    }









/* --------------------------------

  #main-content initialize sp

-------------------------------- */

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

    #main-content {

        font-size: 3.733vw;

    }



    #main-content *.price {

        font-size: 4.3vw !important;

    }



    #main-content *.price *.num {

        font-size: 7.6vw !important;

        /* margin: 0 .25em; */

    }



    #main-content *.name {

        /*        font-size: 3.2vw;*/

        font-size: 4.3vw;

    }



    #main-content .itemList .sale a {

        padding: 1vw 0;

        line-height: 1.2;

    }

}



/* ================================

  Utility

================================ */

#main-content *.ut-hide {

    display: none !important

}



#main-content *.ut-non {

    pointer-events: none;

}



#main-content *.ut-in-block {

    display: inline-block;

}



#main-content *.ut-left {

    float: left;

}



#main-content *.ut-right {

    float: right;

}



#main-content *.ut-clearfix::after {

    clear: both;

    content: '';

    display: block;

}



#main-content *.ut-sp {

    display: none;

}



#main-content *.ut-wrapper {

    max-width: 1180px;

    margin-left: auto;

    margin-right: auto;

    padding-left: 40px;

    padding-right: 40px;

}



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

    #main-content *.ut-wrapper {

        padding-left: 40px;

        padding-right: 40px;

    }

}



/* --------------------------------

  Utility Tablet

-------------------------------- */

@media screen and (max-width: 1024px) and (min-width: 768px) {

    #main-content *.ut-wrapper {}

    

#usage .swiper-container {

    max-width: 100% !important;

}

    

}



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

    #usage .swiper-container {

        max-width: 100% !important;

           }

    

}

/* --------------------------------

  Utility sp

-------------------------------- */



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

    #main-content *.ut-pc {

        display: none !important

    }



    #main-content *.ut-sp {

        display: block !important

    }



    #main-content *.ut-wrapper {

        max-width: 100vw;

       margin: 0 auto;

       padding: 0 15px;

    }

}



/* =====================

  - #main-content

    > #hero

    > #anchor

    > #contents

      > #jute

      > #turkey

      > #indeia

      > #water-repellent

      > #polyethylene

      > #squeeze

    > #shop

    > #news

    > #privilege

===================== */

/* =====================

  common

===================== */

#main-content {}



#main-content > *:not(:first-child) {

    margin-top: 60px;

    padding-top: 10px;

}



#main-content #contents {

    padding-top: 0;

}



#main-content > #privilege {

    margin-top: 100px;

    padding: 0;

}



#main-content .section__heading {

    text-align: center;

    margin-bottom: 60px;

}



#main-content .section__ttl {

    font-size: 36px;

    font-weight: 900;

    margin: 60px auto 30px;

    padding-top: 60px;

    /* margin-bottom: calc(20px - .1em); */

}

#main-content .section__ttl-2 {

    font-size: 24px;

    font-weight: 500;

    margin-bottom: calc(20px - .1em);

}



#main-content .section__container:not(:first-of-type) {

    margin-top: 60px;

}



#main-content .movie__wrap {

    position: relative;

}



#main-content .movie__layer {

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    /* -webkit-transform: translateY(-50%); */

    /* transform: translateY(-50%); */

    text-align: center;

}



#main-content .movie__layer > * {

    color: #000;

}



#main-content .colum {}



#main-content .colum__inner {

    display: flex;

    justify-content: space-between;

    padding: 10px 5.363%;

    border: 1px solid #ddd;

    border-radius: 8px;

        align-items: center;

}



#main-content .colum__img {

    width: 60%;

}



#main-content .colum__txt {

    width: 36%;

}



#main-content .colum__ttl {

    font-size: 20px;

    line-height: 1.5;

    margin-top: .5em;

    margin-bottom:5px;

}

#main-content .price {

    font-size: 18px;

    line-height: 1.5;

  

    font-weight: bold;

}

#main-content .price .num {

    font-size: 32px;

    line-height: 1.5;

    margin-top: .3em;

    margin-bottom: 10px;

    font-weight: bold;

}



#main-content .colum__ttl span {

    display: block;

    font-size: 16px;

}

#main-content .colum__txt p{

    font-size: 16px;

}

#main-content .sp {

    font-size: 16px;

    margin: 2px 2px;

    padding: 2px 2px;

    /* border-radius: 3px; */

    width: 120px;

    text-align: center;

    font-weight: bold;

    background-color: rgb(139, 26, 39);

    border: 1px solid rgb(139, 26, 39);

    color: rgb(255, 255, 255);

}



#main-content .colum__txt .btn__circle {

    width: 150px;

    margin-top: 30px;

}



#main-content .btn__movie {

    display: flex;

    justify-content: center;

    align-items: center;

}



#main-content .btn__movie a {

    display: inline-block;

    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2297px%22%20height%3D%2297px%22%3E%3Cdefs%3E%3Cfilter%20filterUnits%3D%22userSpaceOnUse%22%20id%3D%22Filter_0%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2297px%22%20height%3D%2297px%22%20%3E%20%3CfeOffset%20in%3D%22SourceAlpha%22%20dx%3D%220%22%20dy%3D%220%22%20%2F%3E%20%3CfeGaussianBlur%20result%3D%22blurOut%22%20stdDeviation%3D%223.742%22%20%2F%3E%20%3CfeFlood%20flood-color%3D%22rgb(0%2C%200%2C%200)%22%20result%3D%22floodOut%22%20%2F%3E%20%3CfeComposite%20operator%3D%22atop%22%20in%3D%22floodOut%22%20in2%3D%22blurOut%22%20%2F%3E%20%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D%22linear%22%20slope%3D%220.3%22%2F%3E%3C%2FfeComponentTransfer%3E%20%3CfeMerge%3E%20%3CfeMergeNode%2F%3E%20%3CfeMergeNode%20in%3D%22SourceGraphic%22%2F%3E%20%3C%2FfeMerge%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cg%20filter%3D%22url(%23Filter_0)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20fill%3D%22rgb(255%2C%20255%2C%20255)%22%20d%3D%22M48.000%2C82.999%20C28.670%2C82.999%2013.001%2C67.327%2013.001%2C47.997%20C13.001%2C28.668%2028.670%2C12.999%2048.000%2C12.999%20C67.330%2C12.999%2082.999%2C28.668%2082.999%2C47.997%20C82.999%2C67.327%2067.330%2C82.999%2048.000%2C82.999%20ZM38.667%2C35.883%20L38.667%2C61.280%20L63.615%2C48.582%20L38.667%2C35.883%20Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');

    background-repeat: no-repeat;

    background-position: center;

    background-size: cover;

    width: calc(10.87% + 24px);

    height: calc(19.34% + 24px);

    cursor: pointer;

}



#main-content .btn__square a {

    display: inline-block;

    padding: 1.5em 0;

    width: 100%;

    color: #000;

    font-size: 16px;

    line-height: 1;

    text-align: center;

    border: 1px solid #999;

    border-radius: 8px;

}



#main-content .btn__circle a {

    display: inline-block;

    padding: 0.714em 0;

    width: 100%;

    color: #000;

    font-size: 14px;

    line-height: 1;

    text-align: center;

    border: 1px solid #999;

    border-radius: 1.429em;

}



#main-content .link__txt a {

    line-height: 1;

    text-decoration: underline;

}



@media screen and (min-width: 768px) {



    #main-content .btn__movie a:hover,

    #main-content .btn__square a:hover,

    #main-content .btn__circle a:hover {

        opacity: .8;

        transition: .3s;

    }

}



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

    #main-content {}



    #main-content > *:not(:first-child) {

        margin-top: 8vw;

        padding-top: 1vw;

    }



    #main-content #contents {

        margin-top: 13.33vw;

        padding-top: 0;

    }



    #main-content > #privilege {

        margin-top: 21.33vw;

        padding: 0;

    }



    #main-content .section__heading {

        margin-bottom: 10.67vw;

    }



    #main-content .section__heading p {

        text-align: center;

    }



    #main-content .section__ttl {

        font-size: 7.2vw;

        margin-bottom: calc(4vw - .1em);

    }



    #main-content .section__container:not(:first-of-type) {

        margin-top: 10.67vw;

    }



    #main-content .colum__inner {

        flex-wrap: wrap;

        padding:5vw;

    }



    #main-content .colum__img {

        width: 100%;

        margin-bottom: 5.333vw;

    }



    #main-content .colum__txt {

        width: 100%;

    }



    #main-content .colum__ttl {

        font-size: 4.8vw;

        /* margin-bottom: calc(5.333vw - .25em); */

    }



    #main-content .colum__ttl span {

        font-size: 4.267vw;

    }



    #main-content .colum__txt .btn__circle {

        width: 100%;

        margin-top: 5.333vw;

    }



    #main-content .btn__movie a {

        width: calc(16vw + 24px);

        height: calc(16vw + 24px);

    }



    #main-content .btn__square a {

        padding: 1.321em 0;

        width: 100%;

        font-size: 3.733vw;

    }



    #main-content .btn__circle a {

        padding: 1.321em 0;

        width: 100%;

        font-size: 3.733vw;

        border-radius: 1.821em;

    }

}



/* =====================



  #hero



===================== */

#hero .mainvisual {}



#hero .mainvisual__img {

    max-width:1250px;

    margin: 60px auto 60px;

}



#hero .mainvisual__ttl {

    font-size: 64px;

    font-weight: 900;

    text-align: center;

    letter-spacing:5px;

    margin-top: 10px;

  

}

#hero .mainvisual__ttl2 {

    font-size: 30px;

    font-weight: 500;

    text-align: center;

    letter-spacing:2px;

    margin-top: 100px;

    margin-bottom: 30px;

}

#hero .mainvisual__ttl3 {

    font-size: 26px;

    font-weight: 500;

    text-align: center;

    letter-spacing:2px;

  

}



#hero .lead {

    margin-top: 50px;

    font-size: 18px;

    text-align: center;

}



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

    #hero .mainvisual__img {

        max-width: 100%;

        margin: 0px auto 8vw;

    }



    #hero .mainvisual__ttl {

        font-size: 10vw;

    }

    #hero .mainvisual__ttl2 {

        font-size: 6.4vw;

        margin-bottom: 15px;

    }

    #hero .mainvisual__ttl3 {

    

        font-size: 4.2vw;

    }



    #hero .lead {

        margin-top: 9.333vw;

        font-size: 3.733vw;

        text-align: left;

    }

}



/* =====================



  #anchor



===================== */



#anchor .anchor {

    background-color: #fff;

    border-bottom: 1px solid #dddddd;

}



#anchor .anchor__list {

    display: list-item;

    overflow-x: auto;

    overflow-y: hidden;

    white-space: nowrap;

    font-size: 0;

}



#anchor .anchor__item {

  position: relative;

  display: inline-block;

  /* width: 14.5%; */

  width: 15.454%;

  min-width: 150px;

  text-align: center;

  opacity: 0.3;

  -webkit-transition: .3s ease;

  transition: .3s ease;

  }

}



#anchor .anchor__item:not(:first-child) {

    margin-left: 1%;

}



#anchor .anchor__item.js_current {

    opacity: 1;

    transition: .3s;

}



#anchor .anchor__item::after {

    content: '';

    position: absolute;

    bottom: 0;

    display: block;

    width: 100%;

    height: 0;

    background: #999999;

    -webkit-transition: .3s ease;

    transition: .3s ease;

}



#anchor .anchor__item.js_current::after {

    left: 0;

    right: 0;

    height: 3px;

    -webkit-transition: .3s ease;

    transition: .3s ease;

}



#anchor .anchor__item a {

    display: block;

    padding-bottom: 25px;

    color: #000;

}



#anchor .anchor__img {

    display: inline-block;

    width: 60%;

}



#anchor .anchor__txt {

    display: block;

    font-size: 16px;

    font-weight: bold;

    line-height: 1.5;

    margin-top: calc(20px - .2em);

    margin-bottom: -.2em;

}



@media screen and (min-width: 768px) {

    #anchor .anchor__item:hover {

        opacity: 1;

    }



    #anchor .anchor__item:hover::after {

        left: 0;

        right: 0;

        height: 3px;

        -webkit-transition: .3s ease;

        transition: .3s ease;

    }

}



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

    #anchor .anchor__list {

        max-width: none;

        margin-left: 0;

        margin-right: 0;

        padding-left: 4vw;

        padding-right: 4vw;

    }



    #anchor .anchor__item {

        /*        width: 26.67vw;*/

        width: 36vw;

        min-width: initial;

        min-width: auto;

    }



    #anchor .anchor__item:not(:first-child) {

        margin-left: 3.2vw;

        /*        margin-left: 2.667vw;*/

    }



    #anchor .anchor__item a {

        padding-bottom: 4vw;

    }



    #anchor .anchor__img {

        width: 16.8vw;

    }



    #anchor .anchor__txt {

               font-size: 2.933vw;

        /* font-size: 5.2vw; */

        line-height: 1.3;

        margin-top: calc(2.667vw - .15em);

        margin-bottom: -.15em;

    }

}



/* =====================



  #contents



===================== */

#contents > * {

    padding-top: 0px;

}



#contents > *:not(:last-of-type) {

    margin-bottom: 120px;

}



#contents .product {}



#contents .product__main {

    display: flex;

    align-items: center;

}



#contents .product__visual {

    /* width: 58.545%;

    min-width: 58.545%; */

    width: 50%;

    min-width: 50%;

}



#contents .product__item {

    margin-left: 3.636%;

    width: 100%;

}



#contents .feature {

    margin-top: 100px;

}



#contents .feature__inner {

    display: flex;

    align-items: center;

    justify-content: space-between;

}



#contents .feature__img {

    width: 50%;

}



#contents .feature__txt {

    width: 47.27%;

    font-size: 16px;

}



#contents .colum {

    margin-top: 100px;

}



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

    #contents {}



    #main-content #contents > * {

        padding-bottom: 20px;

    }



    #contents > *:not(:last-of-type) {

        margin-bottom: 8vw;

    }



    #contents .product {}



    #contents .product__main {

        flex-wrap: wrap;

    }



    #contents .product__visual {

        width: 100%;

        min-width: none;

    }



    #contents .product__item {

        margin-left: 0;

        margin-top: 8vw;

    }



    #contents .feature {

        margin-top: 13.33vw;

    }



    #contents .feature__inner {

        flex-wrap: wrap;

        justify-content: center;

        max-width: none;

        width: 100%;

        padding-left: 0;

        padding-right: 0;

    }



    #contents .feature__img {

        width: 100%;

        margin-bottom: 8vw;

    }



    #contents .feature__txt {

        width: 100%;

        font-size: 3.733vw;

    }



    #contents .colum {

        margin-top: 13.33vw;

    }

}



/* =====================



  #usage



===================== */

#usage {}



 .section__inner {

    padding-top: 80px;

    padding-bottom: 80px;

    background-color: #f2f2f2;

}



#usage .swiper-container {

    max-width: 800px;

    margin: auto;

    overflow: visible;

}



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

    #usage .section__inner {

        padding-top: 13.33vw;

        padding-bottom: 13.33vw;

    }



    #usage .swiper-container {

        max-width: 66.67vw;

    }



    #usage .section__ttl {

        font-size: 4.8vw;

        line-height: 1.5;

        margin-top: -.25em;

        margin-bottom: -.25em;

    }



    #usage .section__ttl .ut-in-block {

        white-space: nowrap;

    }

}



/* =====================



  #shop



===================== */

#shop .list__3colums {

    display: flex;

    justify-content: space-between;

}



#shop .list__3colums li {

    width: 30.9%;

    text-align: center;

}



#shop .list__3colums .list__img {

    margin-bottom: 20px;

}



#shop .list__3colums .list__txt {}



#shop .list__3colums .list__ttl {

    font-size: 16px;

    margin-bottom: calc(20px - .2em);

}



#shop .shop__efforts {

    padding: 40px;

    text-align: center;

    background-color: #f2f2f2;

    border-radius: 8px;

}



#shop .shop__efforts__inner {

    display: inline-block;

    text-align: left;

    vertical-align: middle;

}



#shop .shop__efforts__inner p {

    position: relative;

    padding-left: 1em;

}



#shop .shop__efforts__inner p:not(:first-child) {

    margin-top: .4em;

}



#shop .shop__efforts__inner p::before {

    content: '・';

    position: absolute;

    left: 0;

}



#shop .shop__efforts strong {

    color: #000;

}



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

    #shop .list__3colums {

        flex-wrap: wrap;

    }



    #shop .list__3colums li {

        width: 100%;

    }



    #shop .list__3colums li:not(:first-child) {

        margin-top: 10.67vw;

    }



    #shop .list__3colums .list__img {

        margin-bottom: 4vw;

    }



    #shop .list__3colums .list__txt p {

        text-align: left;

    }



    #shop .list__3colums .list__ttl {

        font-size: 4.267vw;

        margin-bottom: calc(4vw - .2em);

    }



    #shop .shop__efforts {

        margin: 0 -8vw;

        padding: 8vw;

        border-radius: 0;

    }



    #shop .shop__efforts__inner p {

        line-height: 1.5;

        margin-top: -.25em;

        margin-bottom: -.25em;

    }



    #shop .shop__efforts__inner p:not(:first-child) {

        margin-top: 2.667vw;

    }

}



/* =====================



  #privilege



===================== */

#privilege {

    background-color: #f2f2f2;

}



#privilege .section__inner {

    display: flex;

    align-items: center;

    justify-content: space-between;

    /*    padding-top: 60px;*/

    padding-bottom: 90px;

}





#privilege .section__inner-2 {

    /*    display: flex;*/

    align-items: center;

    /*    justify-content: space-between;

    */

    /*    padding-top: 60px;*/

    padding-bottom: 30px;



}



#privilege .privilege__title {

    width: 100%;

    margin-right: 30px;

}





#privilege .privilege__img {

    width: 30%;

    margin-right: 30px;

}



#privilege .privilege__txt {

    width: 72.72%;

}



#privilege .privilege__title {

    /*

    display: flex;

    flex-wrap: wrap;

*/

    text-align: center;



}



#privilege .privilege__ttl {

    /*    font-size: 18px;*/

    /*    font-size: 20px;*/

    font-size: 18px;

    /*    margin-bottom: calc(25px - .2em);*/

    margin-bottom: 10px;

}



#privilege .privilege__ttl-1 {

    /*    font-size: 18px;*/

    font-size: 46px;

    margin-bottom: calc(40px - .2em);

}



#privilege .privilege__icn {

    /*    width: 40%;*/

    width: 48%;

    margin-bottom: 20px;

    text-align: center;

    justify-content: center;

}



#privilege .privilege__app {

    margin-top: 30px;

}



#privilege .privilege__app-list {

    display: flex;

    align-items: center;

}



#privilege .privilege__app-list li {

    width: 21.25%;

}



#privilege .privilege__app-list li:not(:first-of-type) {

    margin-left: 20px;



}



@media screen and (max-width: 1023px) and (min-width: 768px) {

    #privilege .section__inner {

        align-items: flex-start;

    }

}



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



    #privilege .section__inner {

        flex-wrap: wrap;

        /*        padding-top: 10.67vw;*/

        padding-top: 5vw;

        padding-bottom: 10.67vw;

    }





    #privilege .section__inner-2 {

        /* display: flex; */

        align-items: center;

        /* justify-content: space-between; */

        padding-top: 3vw;

        /* padding-bottom: 90px; */

    }



    #privilege .privilege__img {

        width: 58.13vw;

        margin: auto;

    }



    #privilege .privilege__title {

        width: 100%;

        margin-top: 8vw;

    }



    #privilege .privilege__txt {

        width: 100%;

        margin-top: 8vw;

    }



    #privilege .privilege__ttl {

        /*

        font-size: 4.267vw;

        margin-bottom: calc(5.333vw - .2em);

*/

        /*        font-size: 5vw;*/

        font-size: 4.3vw;

        margin-bottom: calc(5.333vw - .2em);

        /*        font-weight: 400;*/

        text-align: center;

    }



    #privilege .privilege__ttl-1 {

        font-size: 8.2vw;

        /*        margin-bottom: calc(5.333vw - .2em);*/

        margin-bottom: 0px;

    }



    #privilege .privilege__icn {

        /*        width: 55.6vw;*/

        width: 78vw;

        margin-bottom: 5.333vw;

        margin: 0 auto 30px;

    }



    #privilege .privilege__app {

        margin-top: 8vw;

    }



    #privilege .privilege__app-list {

        display: flex;

        justify-content: space-between;

    }



    #privilege .privilege__app-list li {

        width: 40.53vw;

    }



    #privilege .privilege__app-list li:not(:first-of-type) {

        margin-left: 0;

    }

}



/* =====================



  Modal



===================== */

/* =====================

  .remodal initialize

====================== */

.remodal {

    color: #000;

    /* unique value */

    font-size: 14px;

    /*   jp_only   */

    font-family: "Helvetica", "Noto Sans TC", "Microsoft JhengHei", "微軟正黑體", "Arial", sans-serif;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



.remodal a {

    display: inline-block;

    color: #585858;

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

    -webkit-box-shadow: none;

    box-shadow: none;

    outline: none;

}



.remodal a:link,

.remodal a:visited,

.remodal a:hover,

.remodal a:active,

.remodal a:focus {

    color: #585858;

    text-decoration: none;

}



.remodal h1,

.remodal h2 {

    line-height: 1.4;

    /* unique value */

    margin: -.2em 0;

    /* unique value */

    padding: 0;

    /*   jp_only   */

    font-family: "Gothic MB101 Bold", "MySansSerif", "YakuHanJP", sans-serif;

    text-rendering: optimizeLegibility;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



.remodal h3,

.remodal h4,

.remodal h5,

.remodal h6 {

    line-height: 1.4;

    /* unique value */

    margin: -.2em 0;

    /* unique value */

    padding: 0;

}



.remodal p {

    color: #585858;

    /* unique value */

    line-height: 1.8;

    /* unique value */

    margin: -.4em 0;

    /* unique value */

    padding: 0;

}



.remodal img {

    width: 100%;

    vertical-align: bottom;

}



/* =====================

  initialize End

====================== */



html.remodal-is-locked {

    touch-action: none;

}



.remodal-overlay {

    background: rgba(255, 255, 255, 0.8);

}



.remodal-wrapper {

    padding: 0;

}



.remodal {

    margin: auto;

    padding: 0;

    /*box-shadow: 0px 0px 10px #999;*/

}



.remodal-close {

    left: initial;

    left: auto;

    right: 0;

    width: 60px;

    height: 60px;

    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218px%22%20height%3D%2218px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20fill%3D%22rgb(0%2C%200%2C%200)%22%20d%3D%22M17.987%2C16.428%20L16.438%2C17.980%20L8.999%2C10.541%20L1.561%2C17.980%20L0.012%2C16.428%20L7.449%2C8.991%20L0.012%2C1.553%20L1.561%2C0.003%20L8.999%2C7.441%20L16.438%2C0.003%20L17.987%2C1.553%20L10.550%2C8.991%20L17.987%2C16.428%20Z%22%2F%3E%3C%2Fsvg%3E');

    background-color: rgba(255, 255, 255, 0);

    background-size: 20px;

    background-repeat: no-repeat;

    background-position: center;

}



.remodal-close:before {

    content: none;

}



.remodal.movie {

    background: none;

    padding: 60px 0;

}



.remodal .video__wrap {

    width: 100%;

    margin-left: auto;

    margin-right: auto;

}



.remodal .video__wrap .video__container {

    position: relative;

    padding-bottom: 56.25%;

    height: 0;

    overflow: hidden;

}



.remodal .video__wrap .video__container iframe {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}



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

    .remodal.movie {

        padding: 12vw 0;

    }



    .remodal-close {

        right: 2vw;

        width: 12vw;

        height: 12vw;

        background-size: 4vw;

    }

}



/* =====================



  Function



===================== */

#main-content .swiper-parent {

    overflow: hidden;

}



#main-content .swiper-wrapper {

    user-select: none;

}



#main-content .product__visual .swiper-container {

    padding-bottom: 30px;

}



#main-content .swiper-pagination {

    bottom: 2px;

    margin: 0;

    font-size: 0;

    line-height: 1;

    overflow: visible;

}



#main-content .swiper-pagination-bullet {

    opacity: .4;

    background: #585858;

    outline: none;

    user-select: none;

}



#main-content .swiper-pagination-bullet-active {

    opacity: 1;

}



#main-content .swiper-button-prev,

#main-content .swiper-button-next {

    width: 9.782%;

    height: 29.67%;

    margin-top: calc(-15.53% - 15px);

    background-size: 20px 38.1px;

    background-position: center;

    outline: none;

    user-select: none;

}



#main-content .swiper-button-prev {

    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224px%22%20height%3D%2243px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20stroke%3D%22rgb(88%2C%2088%2C%2088)%22%20stroke-width%3D%222px%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20fill%3D%22none%22%20d%3D%22M20.302%2C40.995%20L0.998%2C20.990%20L20.302%2C0.986%20%22%2F%3E%3C%2Fsvg%3E');

    left: 0;

}



#main-content .swiper-button-next {

    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224px%22%20height%3D%2243px%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20stroke%3D%22rgb(88%2C%2088%2C%2088)%22%20stroke-width%3D%222px%22%20stroke-linecap%3D%22butt%22%20stroke-linejoin%3D%22miter%22%20fill%3D%22none%22%20d%3D%22M2.465%2C1.003%20L22.002%2C21.008%20L2.465%2C41.011%20%22%2F%3E%3C%2Fsvg%3E');

    right: 0;

}



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



    #main-content .swiper-button-prev,

    #main-content .swiper-button-next {

        display: none;

    }



    #main-content .product__visual .swiper-container {

        padding-bottom: 5.333vw;

    }



    #main-content .swiper-pagination {

        bottom: 0.533vw;

    }



    #main-content .swiper-pagination-bullet {

        width: 2.133vw;

        height: 2.133vw;

        margin: 0 1.067vw;

    }

}



/* =====================



  .itemList



===================== */

#main-content .itemList {

    display: flex;

    flex-wrap: wrap;

}



#main-content .itemList > li {

    width: 100%;

}



#main-content .itemList > li:not(:first-child) {

    margin-top: 50px;

}



#main-content .itemList > li > a {

    display: flex;

    align-items: center;

}



#main-content .itemList .thumb {

    width: 42%;

    min-width: 42%;

}



#main-content .itemList .detail {

    margin-left: 3.846%;

}



/* #main-content .itemList .name {

    margin-bottom: 0.1em;

} */



@media screen and (min-width: 768px) {

    #main-content .itemList a:hover {

        opacity: .8;

        transition: .3s;

    }

}



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

    #main-content .itemList > li:not(:first-child) {

        margin-top: 5.333vw;

    }



    #main-content .itemList > li > a {

        justify-content: space-between;

    }



    #main-content .itemList .thumb {

        width: 40vw;

        min-width: none;

    }



    #main-content .itemList .detail {

        width: 50vw;

        margin-left: 0;

        padding-left: 2.5vw;

    }



    #main-content .itemList .name {

        /* margin-bottom: 4.8vw; */

    }

}



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

     #main-content .common__title {

         font-size: 20px;

     }



     #main-content .common__txt {

         font-size: 16px;

     }



     #main-content p {

         font-size: 1.2rem;

     }



     #main-content .section__ttl {

         font-size: 30px;

             margin: 40px auto 20px;

             padding-top: 60px;

     }

#main-content .itemList .name {

font-size: 18px;

margin-bottom: 0px;

}

#main-content .price .num{

    font-size: 30px;

}

#main-content .itemList .thumb {

    width: 40%;

    min-width: 40%;

}

}

@media screen and (max-width:450px)

{



#hero .mainvisual__ttl {

    font-size: 12vw;

    margin-bottom: 3px;

}



#hero .mainvisual__ttl3 {

    font-size: 4.8vw;

}



#main-content .section__ttl{

    font-size: 1.8rem;

    margin: 30px 0;

    padding-top: 5px;

}

#main-content .section__ttl-2{

    font-size: 1.3rem;

    line-height: 1.8;

}



    #main-content .section__heading p{

        font-size: 1.1rem;

    }





}

/* 表單 */



.table-ttl {

font-size: 1.5rem;

font-weight: bold;

 width: 80%;

 margin: 0 auto ;

padding-bottom: 8px;

border-bottom: 1px solid #afafaf;

}

table {

    border-collapse: collapse;

    width: 80%;

    margin: 0 auto 100px;

}

th,

td {

    font-size: 1rem;

    padding: 8px;

    text-align: left;

    border-bottom: 1px solid #afafaf;

}





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

.table-ttl {

    font-size: 1.2rem;

    

    width: 100%;

   

}



table {

    width: 100%;

        margin: 0 auto 60px;



}



th,

td {

    font-size: .85rem;

    

}

}

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

.table-ttl {

    font-size: 1rem;

}



table {

    width: 100%;

    margin: 0 auto 40px;

}



th,

td {

    font-size: .8rem;

      padding: 4px;

}





}