/* ===== Begin common.css ===== */
@charset "UTF-8";
/* function
----------------------------------------------*/
/* mixin
----------------------------------------------*/
/* animation
----------------------------------------------*/
@keyframes siteGuide_scroll {0%{
    height: 0;
  }40%{
    height: 110px;
    transform: translateY(0);
  }100%{
    height: 110px;
    transform: translateY(110px);
  }
}

@keyframes loading {0%{
    height: 0px;
  }40%{
    height: 102px;
  }41%{
    height: 134px;
  }80%{
    height: 232px;
  }
}/* override
----------------------------------------------*/
body{
  border-top: none;
}.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close{
  cursor: zoom-out;
}.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter{
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
      user-select: none;
}button.mfp-close,
button.mfp-arrow{
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
  touch-action: manipulation;
}button::-moz-focus-inner{
  padding: 0;
  border: 0;
}.mfp-close{
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  padding: 0 0 18px 10px;
  color: #FFF;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace;
}.mfp-close:hover,
.mfp-close:focus{
  opacity: 1;
}.mfp-close:active{
  top: 1px;
}.mfp-close-btn-in .mfp-close{
  color: #333;
}.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close{
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}.mfp-iframe-holder .mfp-close{
  top: -40px;
}/* Main image in popup */
img.mfp-img{
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}.mfp-gallery .mfp-image-holder .mfp-figure{
  cursor: pointer;
}.slick-list.dragging{
  cursor: pointer;
  cursor: hand;
}.slick-slide{
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}[dir="rtl"] .slick-slide{
  float: right;
}.slick-slide img{
  display: block;
}.slick-slide.slick-loading img{
  display: none;
}.slick-slide.dragging img{
  pointer-events: none;
}.slick-initialized .slick-slide{
  display: block;
}.slick-loading .slick-slide{
  visibility: hidden;
}.slick-vertical .slick-slide{
  display: block;
  height: auto;
  border: 1px solid transparent;
}.mfp-iframe-holder button.mfp-close{
  cursor: pointer;
  position: absolute;
  z-index: 2;
  top: -70px;
  right: 0;
  display: block;
  width: 55px;
  height: 55px;
  opacity: 1;
  background: url("") 0 0 no-repeat;
  background-size: contain;
}

@media (max-width: 1049px) {.mfp-iframe-holder button.mfp-close{
    width: 42px;
    height: 42px;
  }
}

@media print, (min-width: 1050px) {.mfp-iframe-holder button.mfp-close:hover{
    opacity: 0.8;
  }
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {.mfp-img-mobile img.mfp-img{
    padding: 0;
  }.mfp-img-mobile .mfp-close{
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, .6);
    position: fixed;
    text-align: center;
    padding: 0;
  }
}

@media all and (max-width: 900px) {
}

@media all and (-ms-high-contrast: none) {
}
/* ===== End common.css ===== */


/* ===== Begin main.css ===== */



@import url("https://fonts.googleapis.com/css?family=Noto+Serif+JP:400,500,600,700&subset=japanese");

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,var,b,i,a,dl,dt,dd,ol,ul,li,button,input,textarea,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,main,time,mark,audio,video{

margin:0;

padding:0;

border:0;

outline:0;

font-size:100%;

vertical-align:baseline;

background:transparent;

-webkit-box-sizing:border-box;

box-sizing:border-box;

}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{

display:block;

}html{

font-size:62.5%;

}body{

-webkit-text-size-adjust:100%;

line-height:1;

font-size:1.6rem;

color:#595757;

}img{

border-style:none;

max-width:100%;

height:auto;

    vertical-align: bottom;

}progress{

vertical-align:baseline;

}svg:not(:root){

overflow:hidden;

}audio,canvas,progress,video{

display:inline-block;

}button,[type="button"],[type="reset"],[type="submit"],[role="button"]{

cursor:pointer;

}[disabled]{

cursor:default;

}[type="number"]{

width:auto;

}[type="search"]{

-webkit-appearance:textfield;

}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{

-webkit-appearance:none;

}textarea{

overflow:auto;

resize:vertical;

}button,input,optgroup,select,textarea{

font:inherit;

margin:0;

}optgroup{

font-weight:bold;

}button,input{

overflow:visible;

}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{

border-style:0;

padding:0;

}button:-moz-focusring,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{

outline:1px dotted ButtonText;

}button,html [type="button"],[type="reset"],[type="submit"]{

-webkit-appearance:button;

}button,select{

text-transform:none;

}button,input,select,textarea{

background-color:transparent;

border-style:none;

color:inherit;

}select{

-moz-appearance:none;

-webkit-appearance:none;

}select::-ms-expand{

display:none;

}select::-ms-value{

color:currentColor;

}legend{

border:0;

color:inherit;

display:table;

max-width:100%;

white-space:normal;

}::-webkit-file-upload-button{

-webkit-appearance:button;

font:inherit;

}[type="search"]{

-webkit-appearance:textfield;

outline-offset:-2px;

}a{

text-decoration:none;

color:inherit;

}a:active,a:hover{

outline-width:0;

}a,area,button,[role="button"],input:not([type=range]),label,select,summary,textarea{

-ms-touch-action:manipulation;

touch-action:manipulation;

}ol,ul,li{

list-style:none;

}table{

border-collapse:collapse;

border-spacing:0;

}th{

font-weight:normal;

}hr{

display:block;

height:0;

border:0;

margin:0;

padding:0;

}h1,h2,h3,h4,h5,h6{

font-weight:normal;

}code,kbd,pre,samp{

font-family:Consolas, 'Courier New', Courier, Monaco, monospace;

}blockquote,q{

quotes:none;

}blockquote:before,blockquote:after,q:before,q:after{

content:'';

content:none;

}.c085{

    display: none !important;

}.c025{

    display: inline-block;

}.c024{ display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; }.c031{ flex-direction: row-reverse !important; }.c074{

    overflow: hidden;

}/* project

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

a.c013{

    border: solid 2px #d8d9de;

    border-radius: 5px;

    letter-spacing: 1px;

    display: inline-block;

    padding: 5px 8rem;

    transition: all 0.3s ease 0s;

}a.c013:hover{

    background: #d8d9de;

}a.c013.c013-more{

    font-size: 22px;

    text-align: left;

    padding: 5px 18.5rem 2.5rem 1.0rem;

    border: none;

    border-radius: 0;

    position: relative;

    transition: .3s ease-in-out;

    margin-top: 74px;

    margin-left: 7px;

}a.c013.c013-more:before{

    content: '';

    position: absolute;

    top: 0;

    left: -25px;

    width: 100%;

    height: 80%;

    border: solid 2px #a3a5a7;

    border-top: none;

    border-left: none;

    transform: skew(45deg, 0);

}a.c013.c013-more:hover{

    background: none;

    opacity: .65;

}a.c013.c015{

    font-size: 18px;

    padding: 3rem 0;

    border: solid 1px #5e6165;

    border-radius: 0;

    transition: .3s ease-in-out;

    text-align: center;

}a.c013.c015:hover,

a.c013.c015.active{

    background: #caccd1;

    border: solid 1px #caccd1;

    color: #fff;

}a.c013.c014{

    font-size: 18px;

    font-weight: bold;

}.c089{

    text-align: left;

}header,

.c044{

    font-family: 'YakuHanJP','Noto Serif JP'," ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "ＭＳ 明朝", "MS Mincho", serif;



}#i001 h1{

    z-index: 99;

}#i001 h1.c007{

    position: absolute;

    top: 43px;

    left: 40px;
	
	width: 170px;

}#i001 h1.after{

    -webkit-transition-duration: 1.6s;

    transition-duration: 1.6s;

    -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);

    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);

    -webkit-transition-property: all;

    transition-property: all;

    -webkit-transition-delay: 0s;

    transition-delay: 0s;

    -webkit-transform: translateX(-160px);

    transform: translateX(-160px);

    position: fixed;

    top: 40px;

    left: 40px;

}#i001 h1.after.show{

    -webkit-transform: translateX(0);

    transform: translateX(0);

}.target{

    -webkit-transition-duration: 1s;

    transition-duration: 1s;

    -webkit-transition-timing-function: ease-in;

    transition-timing-function: ease-in;

    -webkit-transition-property: all;

    transition-property: all;

    -webkit-transition-delay: 0s;

    transition-delay: 0s;

    -webkit-filter: blur(1rem);

    filter: blur(1rem);

    opacity: 0;

}.target.action{

    -webkit-filter: blur(0);

    filter: blur(0);

    opacity: 1;

}.c044{

    width: 100%;

    margin: 0 auto;

}.c046{

    width: 100%;

    position: relative;

}.c041{

    width: 100%;

    max-width: 1400px;

    margin: 0 auto;

    z-index: 1;

}.c059{

    overflow: hidden;

}.c060{

    position: absolute;

    top: 0;

    left: 50%;

    transform: translateX(-50%);

    width: 100%;

    height: 100%;

    z-index: 1;

}.c060 > *{

    opacity: 0;

    -webkit-transform: translate3D(0, 0, 0);

    transform: translate3D(0, 0, 0);

}.c079{

    z-index: 0;

}.c059 img{

    width: 100%;

}.c080{

    vertical-align: bottom;

    width: 100%;

}.c081,

.c082{

    position: absolute;

    z-index: 3;

}.c083{

    position: absolute;

}/* story01 */

.c068:before,

.c068:after{

    content: '';

    position: absolute;

}.c068:before{

    top: 10.68%;

    left: 0;

    width: 50.15%;

    height: 47.35%;

    background: url("../img/stbg1.png") no-repeat left top;

    background-size: contain;

}.c068:after{

    bottom: 0%;

    right: 0;

    width: 50%;

    height: 56.49%;

    height: 56.49%;

    background: url("../img/stbg2.png") no-repeat right top;

    background-size: contain;

    z-index: -1;

}.c008 .c016{

    padding: 4.5rem 0 5rem;

}.c011{

    font-weight: bold;

    margin-bottom: 11px;

}.c010{

    line-height: 1.5;

}/* commitment */

.c049{

    padding-top: 143px;

}.c054{

    width: 100%;

    max-width: 407px;

    margin: 50px auto 18px;

}.c049 + .c049{

    padding-top: 0px;

}.c051{

    background: url("../img/3txt1.png");

    background-repeat: no-repeat;

    background-position: 18vw 235px;

    background-size: 90vw;

    padding-top: 100px;

    padding-bottom: 380px;

    position: relative;

    z-index: 0;

    overflow: hidden;

}.c051:after{

    content: '';

    position: absolute;

    top: 0;

    left: 68.8%;

    width: 6.2%;

    height: 10.93%;


    background-size: contain;

    z-index: 100;

}.c051 .c029{

    position: absolute;

    top: 0;

    left: -100%;

    width: 500%;

    height: 100%;


    background-size: 100%;

}.c052{

    background: url("../img/3txt2.png");

    background-repeat: no-repeat;

    background-position: -6vw 120px;

    background-size: 88vw;

    padding-bottom: 22vw;
	

    position: relative;

    z-index: 0;

    overflow: hidden;
	margin-bottom: 100px;



}.c052:before{

    content: '';

    position: absolute;

    top: 4.625%;

    left: 14.5%;

    width: 5.98%;

    height: 9.6%;


    background-size: contain;

    z-index: 100;

}.c052 .c029{

    position: absolute;

    top: 0;

    right: -100%;

    width: 500%;

    height: 100%;


    transform: rotate(180deg);

    background-size: 100%;

}.c053{

    background: url("../img/3txt3.png");

    background-repeat: no-repeat;

    background-position: right bottom;

    background-size: 76.5vw;

    padding-top: 1px;

    padding-bottom: 20vw;

    position: relative;

    z-index: 0;

    overflow: hidden;

}.c022:before{

    content: '';

    position: absolute;

    top: -1.8%;

    right: 13%;

    width: 7.98%;

    height: 9.6%;


    background-size: contain;

    z-index: 100;

}.c053 .c029{

    position: absolute;

    top: 0;

    left: -100%;

    width: 500%;

    height: 100%;


    background-size: 100%;

}/* other */

.c067{

    margin-bottom: 50px;

    position: relative;

    display: inline-block;

}.c067:after{

    content: '';

    position: absolute;

    bottom: 0;

    width: 200%;

    height: 1px;

    background: #53565a;

}.c061:nth-child(odd) .c067:after{

    right: -208%;

}.c061:nth-child(even) .c067{

    margin-right: 2%;

    text-align: right;

    display: block;

}.c061:nth-child(even) .c067:after{

    left: -154%;

}.c062 .c067{

    width: 100%;

    max-width: 300px;

}.c063 .c067 img{

    max-width: 362px;

}.c065 .c067 img{

    max-width: 354px;

}.c064 .c067{

    width: 100%;

    max-width: 440px;

}.c066 .c067{

    width: 100%;

    max-width: 322px;

}/* lineup */

.c055{

    padding-top: 192px;

}.c058{

    width: 100%;

    max-width: 390px;

    margin: 0 auto;

    margin-bottom: 110px;

}.c057{

    padding-bottom: 7rem;

}.c057 .c011{

    font-size: 20px;

    margin-bottom: 20px;

    line-height: 1.5;

}.c057 .c010{

    margin-bottom: 20px;

}.c057 .c009{

    font-size: 14px;

    display: inline-block;

    line-height: 1.57;

    text-align: left;

    width: 57%;

    margin: 0 auto;

}.c057 dl.c009{

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    flex-wrap:nowrap;

}.c057 dl.c009 dt{

    white-space: nowrap;

}#i005{

    margin: 155px 0 0;

}
#i010{

    margin: 155px 0 0;

}

#footer .c040{

    padding: 20px 0 20px;

}.c045{

    padding: 0 8%;

}

@media all and (-ms-high-contrast: none) {

}.c046.l-commitment_section01{


    background-repeat: no-repeat;

    background-position: 39vw bottom;

    /* background-position: right bottom; */

    background-size: 64vw;

    padding-bottom: 48.1vw;

    position: relative;

    z-index: 0;

    overflow: hidden;

}.c046.l-commitment_section01 .c029{

    position: absolute;

    bottom: 0;

    left: -100%;

    width: 500%;

    height: 70%;


    background-size: 100%;

}.c046.l-commitment_section02{


    background-repeat: no-repeat;

    background-position: -3.5vw bottom;

    background-size: 63.7vw;

    padding-bottom: 46.3vw;

    position: relative;

    z-index: 0;

    overflow: hidden;

}.c046.l-commitment_section02 .c029{

    position: absolute;

    bottom: -10px;

    right: -100%;

    width: 500%;

    height: 70%;


    transform: rotate(180deg);

    background-size: 100%;

}.c043{

    font-size: 36px;

    font-weight: bold;

    margin-bottom: 22px;

}.c042{

    font-size: 14px;

    line-height: 2.14;

}.c042 + .c042{

    margin-top: 2.5rem;

}#footer .c040{

    width: auto;

    max-width: 950px;

}

@media (min-width: 1400px){.c051,

    .c052,

    .c053{

        background-size: inherit;

    }.c052{

        padding-bottom: 580px;

    }.c053{

        background-size: 76.5vw;

        padding-bottom: 415px;

    }

}



@media (min-width: 1024px){.c083{

        z-index: 3;
        top: 15.39%;
        left: 65.8%;
        width: 10.77%;

    }.c081{

        top: 14.08%;
        left: 83.13%;
        width: 5.35%;

    }.c082{

        top: 30.73%;
        left: -7.4375%;
        width: 57.94%;
        opacity: .8 !important;

    }.c077{

        display: flex;

        -webkit-box-orient: horizontal;

        -webkit-box-direction: reverse;

        -ms-flex-direction: row-reverse;

        flex-direction: row-reverse;

    }.c077.c006{

        flex-direction: row;

    }.c078{

        word-break: break-all;

        text-align: right;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-orient: horizontal;

        -webkit-box-direction: reverse;

        -ms-flex-direction: row-reverse;

        flex-direction: row-reverse;

    }.c078 + .c078{

        margin-right: 47px;

    }.c078 .c019{

        display: inline-block;

        line-height: 1.1;

        text-align: left;

        position: relative;

        width: 2.25rem;

        margin: 0 .75vw;

        font-size: 16px;

        text-align: center;

    }.c078 .c019 .c088{

        -webkit-transform: rotate(90deg);

        transform: rotate(90deg);

        position: relative;

        top: -3px;

        left: 0;

        height: 18px;

    }.c078 .c019 .c087{

        -webkit-transform: rotate(90deg);

        transform: rotate(90deg);

        position: relative;

        top: 6px;

        left: 0;

        font-size: 17px;

        height: 18px;

    }.c078 .c019 .text-rod{

        -webkit-transform: rotate(90deg);

        transform: rotate(90deg);

        position: relative;

        top: 2px;

        left: 1px;

    }.c078 .c019 .c090,

    .c078 .c019 .c086{

        position: relative;

        top: -.68125vw;

        left: .78125vw;

        margin-bottom: -.39062vw;

    }.c078 .c019 .text-small{

        position: relative;

        top: -0.28125vw;

        left: 0.11875vw;

        margin-bottom: -.39062vw;

    }.c078 .c019 span{

        display: block;

    }/* story01 */

    .c070{

        width: 100%;

        max-width: 92px;

        margin-right: 175px;

        margin-left: 119px;

    }.c068 .c078{

        padding-top: 220px;

    }.c068 .c069{

        padding-top: 13vw;

        padding-bottom: 17vw;

    }.triple .c008{

        width: 33.333333%;

        float: left;

    }/* commitment */

    .c050{

        width: 100%;

        max-width: 91px;

        margin-left: 35px;

    }.c052 .c050{

        margin-left: 26px;

    }.c053 .c050{

        margin-left: 30px;

    }.c049 .c041{

        padding: 0 6.4vw;

    }.c049 .c078 .c019,

    .c061 .c078 .c019{

        margin: 0 8px;

    }.c061:nth-child(odd) .c078 .c019:first-child{

        margin-right: 0;

    }.c049 .c078{

        padding-top: 45px;

    }.c049 .c052 .c078{

        padding-top: 42px;

    }.c052 .c013-view{

        text-align: right;

    }/* other */

    .c061:nth-child(odd) .c078{

        margin-left: 35px;

    }.c061:nth-child(even) .c078{

        margin-right: 36px;

    }.c062{

        padding-top: 200px;

    }.c062 picture{

        width: 69%;

        max-width: 520px;

    }.c063{

        padding-top: 67px;

    }.c063 picture{

        width: 74.66%;

        max-width: 560px;

    }.c064 picture{

        width: 76.38%;

        max-width: 424px;

    }.c064{

        padding-top: 66px;

    }.c065{

        padding-top: 67px;

    }.c065 picture{

        width: 74.66%;

        max-width: 560px;

    }.c066 picture{

        width: 76.38%;

        max-width: 424px;

    }.c066{

        padding-top: 66px;

    }/* lineup */

    .c056{

        display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important;

    }.c057{

        width: 50%;

        position: relative;

    }.c057 .c014{

        position: absolute;

        bottom: 0;

        left: 50%;

        transform: translateX(-50%);

        min-width: 57%;

    }.l-commitment01 .l-commitment01_picture.active{

        opacity: 1;

    }#l-commitment01-list.top{

        top: 0;

    }#l-commitment01-list.bottom{

        bottom: 0;

    }.l-commitment_page_link a.c015{

        padding: 4.4rem 1.5rem 4.6rem;

    }



}



@media all and (-ms-high-contrast: none) {

}



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

}



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

    @media all and (-ms-high-contrast: none) {

    }

}



@media screen and (max-width: 1024px){.c085{

        display: block !important;

    }.c076{

        display: none !important;

    }a.c013{

        border: solid 1px #d8d9de;

        padding: 5px 2rem;

        font-size: 14px;

    }a.c013.c013-more{

        font-size: 13px;

        padding: 5px 4rem 2rem 0;

        margin-top: 6.5vw;

    }.c062 a.c013.c013-more{

        margin-top: 7.5vw;

    }.c021 a.c013.c013-more{

        margin-top: 11.5vw;

    }.c022 a.c013.c013-more{

        margin-top: 8.5vw;

    }a.c013.c013-more:before{

        border: solid 1px #a3a5a7;

        border-top: none;

        border-left: none;

        top: 11px;

        left: -7px;

        width: 90%;

        height: 55%;

    }a.c013.c015{

        font-size: 14px;

        padding: 1.5rem 4rem;

    }a.c013.c014{

        font-size: 14px;

        margin-top: 3rem;

    }.c008 .c016{

        padding: 3.5rem 0 8.5rem;

    }#i001 h1.c007{

        top: 20px;

        left: 0px;

    }#i001 h1.after{

        display: none;

    }#i001 h1 img{

        width: 110px;

    }.c060{

        width: 100%;

    }.c083{

      top: 16%;
        left: 40.2%;
        width: 30.33%;
        max-width: 180px;
        z-index: 1;

    }.c081{

        top: 9.08%;
        left: 76.33%;
        width: 18.26%;

    }.c082{

                top: 47.77%;
        left: -61.74%;
        width: 276.2%;
        max-width: 589px;
        opacity: .7 !important;

    }.c079{

        height: 121vw;

    }.c080{

        /*transform: scale(2.65) translateX(-10vw) translateY(11vw); */
        width: 100%;

    }.c044,

    .c046,

    .c041{

        width: 100%;

        min-width: 100%;

    }/* SP用カラムも必要 */

    .c077.c023{

        display: flex;

        -webkit-box-orient: horizontal;

        -webkit-box-direction: reverse;

        -ms-flex-direction: row-reverse;

        flex-direction: row-reverse;

        justify-content: center

    }.c077.c023.c006{

        flex-direction: row;

    }.c077.c023 .c078{

        word-break: break-all;

        text-align: right;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-orient: horizontal;

        -webkit-box-direction: reverse;

        -ms-flex-direction: row-reverse;

        flex-direction: row-reverse;

        padding-top: 5vw;

    }.c077.c023 .c078 + .c078{

        margin-right: 47px;

    }.c077.c023 .c078 .c019{

        display: inline-block;

        line-height: 1.1;

        text-align: left;

        position: relative;

        width: 1.17188vw;

        margin: 0 3vw;

        font-size: 14px;

    }.c077.c023 .c078 .c019 .c088{

        -webkit-transform: rotate(90deg);

        transform: rotate(90deg);

        position: relative;

        top: -1%;

        left: 35%;

        font-size: 120%;

    }.c077.c023 .c078 .c019 .c087{

        -webkit-transform: rotate(90deg);

        transform: rotate(90deg);

        position: relative;

        top: 0;

        left: 0;

        font-size: 17px;

    }.c077.c023 .c078 .c019 .text-rod{

        -webkit-transform: rotate(90deg);

        transform: rotate(90deg);

        position: relative;

        top: 0%;

        left: 17%;

    }.c077.c023 .c078 .c019 .c090,

    .c077.c023 .c078 .c019 .c086{

        position: relative;

        top: -6px;

        left: 9px;

    }.c077.c023 .c078 .c019 span{

        display: block;

    }.c063 .c077{

        text-align: right;

    }.c063 .c078{

        text-align: left;

    }.c065 .c077{

        text-align: right;

    }.c065 .c078{

        text-align: left;

    }/* story01 */

    .c070{

        width: 14.66%;

        max-width: 110px;

        margin: 0 auto 10vw;

    }.c078 .c019{

        display: block;

        font-size: 14px;

        line-height: 2;

    }.c078 + .c078{

        margin-top: 7vw;

    }.c068 .c069{

        padding-top: 32vw;

        padding-bottom: 51vw;

    }.c068:before{

        top: 2.28%;

        width: 100%;

        height: 20.75%;

    }.c068:after{

        bottom: 4%;

        width: 100%;

        height: 24.41%;

    }/* bottle */

    .c047 img{

        width: 100%;

    }.triple .c008{

        width: 100%;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        align-items: center;

        justify-content: center;

    }.triple .c008:nth-child(even){

        -webkit-box-orient: horizontal;

        -webkit-box-direction: reverse;

        -ms-flex-direction: row-reverse;

        flex-direction: row-reverse;

    }.triple .c017{

        width: 50%;

    }.triple .c016{

        width: 50%;

    }.triple .c011{

        line-height: 1.3;

        margin-bottom: 9px;

    }/* commitment */

    .c049{

        padding-top: 0vw;

    }.c054{

        width: 66.6%;

        max-width: none;

        margin-bottom: 0;

    }.c050{

        width: 100%;

        max-width: 13.2%;

        margin-left: 5.5vw;

    }.c049 .c041{

        padding: 0 20px;

    }.c051{

        background-position: 2vw 24vw;

        background-size: 150%;

        padding-top: 87vw;

        padding-bottom: 0;

        position: relative;

    }.c051:after{

        top: 6.24%;

        left: 20%;

        transform: translateX(-20%);

        width: 13.33%;

        height: 5.25%;

    }.c052{

        background-position: -10vw 21vw;

        background-size: 115%;

        padding-top: 80vw;

        padding-bottom: 0;

        position: relative;

    }.c052:before{

        top: 2%;

        left: 68%;

        width: 14.33%;

        height: 6.25%;

    }.c053{

        background-position: 100% -2vw;

        background-size: 105%;

        padding-top: 77vw;

        padding-bottom: 0;

        position: relative;

    }.c022:before{

        top: 2%;

        left: 54%;

        width: 14.98%;

        height: 5.6%;

    }/* other */

    .c061 .c078{

        font-size: 14px;

        padding: 2vw 8.4%;

        line-height: 1.8;

    }.c061 .c063 .c078{

        padding: 1.5vw 8.4% 0;

    }.c061 .c064 .c078{

        padding: .8vw 8.4% 2vw;

    }.c061 .c065 .c078{

        padding: 1.5vw 8.4% 0;

    }.c061 .c066 .c078{

        padding: .8vw 8.4% 2vw;

    }.c067{

        margin-bottom: 26px;

    }.c064 .c067{

        margin-bottom: 28px;

    }.c066 .c067{

        margin-bottom: 28px;

    }.c061:nth-child(even) .c067{

        margin-right: 8.26%;

    }.c061:nth-child(even) .c067:after{

        left: -171%;

    }.c067:after{

        bottom: 50%;

    }.c062{

        padding-top: 35.5vw;

    }.c062:before{

        top: 1.65%;

        right: 5.0%;

        width: 12.5%;

        height: 7.8%;

    }.c062 .c067{

        max-width: 60%;

    }.c061:nth-child(odd) .c067{

        margin-left: 4.86%;

    }.c062:after{

        top: 58.65%;

        right: 8%;

        width: 12.57%;

        height: 7.55%;

    }.c062 picture{

        width: 69.73%;

        display: block;

    }.c063{

        padding-top: 17vw;

    }.c063 .c067{

        margin-bottom: 29px;

    }.c063 .c067 img{

        max-width: 62.46%;

    }.c063 picture > *{

        width: 70%;

    }.c065{

        padding-top: 17vw;

    }.c065 .c067{

        margin-bottom: 29px;

    }.c065 .c067 img{

        max-width: 60%;

    }.c065 picture > *{

        width: 70%;

    }.c061:nth-child(even) .c077 picture{

        text-align: right;

        display: inline-block;

    }.c063:before{

        top: 22.65%;

        left: 8%;

        width: 17%;

        height: 8.42%;

    }.c064{

        padding-top: 20vw;

    }.c064:before{

        top: 60.5%;

        left: 77%;

        width: 16.44%;

        height: 10.64%;

    }.c064 .c067{

        max-width: 70%;

    }.c064 picture{

        width: 69.33%;

        display: block;

    }.c066{

        padding-top: 20vw;

    }.c066:before{

        top: 60.5%;

        left: 77%;

        width: 16.44%;

        height: 10.64%;

    }.c066 .c067{

        max-width: 50%;

    }.c066 picture{

        width: 69.33%;

        display: block;

    }/* lineup */

    .c055{

        padding-top: 25vw;

    }.c058{

        width: 45.73%;

        margin: 0 auto 22vw;

    }.c057{

        width: 100%;

        padding: 0 8.4%;

    }.c057 .c017{

        width: 60%;

        margin: 0 auto;

    }.c057 .c011{

        font-size: 18px;

        margin-bottom: 13px;

    }.c057 .c010{

        font-size: 14px;

        line-height: 1.7;

        margin-bottom: 30px;

    }.c057 .c009{

        /*

        width: 100%;

         */

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

    }#i005{

        margin: 0 0 3px;

    }
	#i010{

        margin: 0 0 3px;

    }
	#commitment01 .l-commitment01_picture .c029,

    #commitment03 .l-commitment01_picture .c029,

    #commitment05 .l-commitment01_picture .c029{

        position: absolute;

        top: 0;

        left: -120%;

        width: 500%;

        height: 48%;


        background-size: 120%;

    }#commitment02 .l-commitment01_picture .c029,

    #commitment04 .l-commitment01_picture .c029{

        position: absolute;

        top: -2px;

        right: -120%;

        width: 500%;

        height: 48%;


        transform: rotate(180deg);

        background-size: 120%;

    }.l-commitment_page_link a:hover:before,

    .l-commitment_page_link a.active:before{

        border-top: solid 1px #fff;

        border-right: solid 1px #fff;

    }.l-commitment_page_link a.c013.c015{

        font-size: 13px;

        padding: 2.0rem 1.5rem;

        text-align: left;

        border: none;

    }.l-commitment_page_link a.c013.c015:hover{

        border: none;

    }.c046.l-commitment_section01{


        background-repeat: no-repeat;

        background-position: 8vw bottom;

        background-size: 91.5vw;

        padding-bottom: 94.8vw;

    }.c046.l-commitment_section01 .c029{

        height: 55%;

    }.c046.l-commitment_section02{


        background-repeat: no-repeat;

        background-position: 0vw bottom;

        background-size: 92vw;

        padding-bottom: 93.5vw;

    }.c046.l-commitment_section02 .c029{

        height: 55%;

    }.c043{

        font-size: 20px;

        margin-bottom: 3.5vw;

    }.c042{

        line-height: 1.71;

    }
	


}



@media screen and (max-width: 768px) {.c077.c023 .c078 .c019 .c088{

        top: -2.5vw;

        left: 1.5vw;

    }.c077.c023 .c078 .c019 .c087{

        top: -0.84375vw;

        left: 1.0vw;

    }.c077.c023 .c078 .c019 .text-rod{

        top: -2px;

        left: 5px;

    }.c078 .c019 .text-small{

        top: -0.28125vw;

        left: 0.71875vw;

    }.c078 .c019 .text-small.text-horizontal{

        top: inherit;

        left: inherit;

    }.c057 .c009{

        width: 100%;

    }

}/* 既存設定上書き */

.mfp-iframe-holder button.mfp-close{

    cursor: pointer;

    position: absolute;

    z-index: 2;

    top: -40px;

    right: 0;

    display: block;

    width: 16px;

    height: 16px;

    opacity: 1;

    background: url(/community/brand/images/ic_close.svg) 0 0 no-repeat;

    background-size: contain;

}.c028 .c027-hamburger{

    right: 40px;

}.c028.c027-open{

    overflow: inherit !important;

}.c028.c027-open .c027-hamburger{

    right: 40px;

}.c028 .c027-nav{

    right: -42%;

}



@media screen and (max-width: 1024px) {.c028 .c027-hamburger,

    .c028.c027-open .c027-hamburger{

        right: 26px;

    }.c028 .c027-nav{

        right: -77.6%;

    }

}.c004,

.c004TOP{

    opacity:0;-webkit-transform:translate3D(0, 0, 0);

    transform:translate3D(0, 0, 0);

}.c005>*,

.c005TOP>*{

    opacity:0;

    -webkit-transform:translate3D(0, 0, 0);

    transform:translate3D(0, 0, 0);

}



@media screen and (max-width: 1024px) {.c004_sp{

        opacity:0;-webkit-transform:translate3D(0, 0, 0);

        transform:translate3D(0, 0, 0);

    }.c005_sp>*{

        opacity:0;

        -webkit-transform:translate3D(0, 0, 0);

        transform:translate3D(0, 0, 0);

    }

}/* マップ部分（フルワイド＆アスペクト比維持） */
.c072{
  width: 100%;
  position: relative;
  padding-bottom: 25%; /* 16:9比率。必要なら変更可 */
  overflow: hidden;
}.c071{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}iframe{
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
  transition: 0.4s;
}iframe:hover{
  filter: none;
  -webkit-filter: none;
}.c040{
    margin-bottom: 50px;
}

/* ===== Custom: SNS icons & MP4 block ===== */
#i001 .hk-header-sns{
  position:absolute;
  top:43px;
  right:40px;
  display:flex;
  gap:12px;
  align-items:center;
  z-index:99;
}

.hk-sns__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:46px;
  height:46px;
  border-radius:999px;
  background: rgba(255,255,255,0.78);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: 0.2s;
}

.hk-sns__link:hover{
  background: rgba(255,255,255,0.95);
  transform: translateY(-1px);
}

.hk-sns__icon{
  width:30px;
  height:30px;
  fill:#C71E7E;
}
.hk-sns__icon2{
  width:30px;
  height:30px;
  fill:#286ED6;
}

.hk-footer-sns{
  margin-top: 10px;
  display:flex;
  gap:10px;
  align-items:center;
}

/* MP4: 元画像(com.jpg)と同じ比率で表示 */
.hk-video-figure{
  position: relative;
  width: 100%;
  /* 元画像(com.jpg)と同じ“帯のサイズ感”にする（全幅にならないよう最大幅を固定） */
  max-width: 1111px;
  margin-left: auto;
  margin-right: auto;
  aspect-ratio: 1111 / 601;
  overflow: hidden;
}

/* aspect-ratio非対応ブラウザ用フォールバック */
.hk-video-figure::before{
  content: "";
  display: block;
  padding-top: 54.1%; /* 601/1111 */
}

.hk-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
  filter: saturate(0.75);
}

.hk-video-overlay{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,0.12);
}

@media screen and (max-width: 768px){
  #i001 .hk-header-sns{
    top: 18px;
    right: 14px;
  }
  .hk-sns__link{width:40px;height:40px;}
  .hk-sns__icon{width:24px;height:24px;}
	.hk-sns__icon2{width:24px;height:24px;}
}

@media screen and (max-width: 480px) {
	.c072{
  width: 100%;
  position: relative;
  padding-bottom: 80%; /* 16:9比率。必要なら変更可 */
  overflow: hidden;
}
	}
/* ===== End main.css ===== */


/* ===== Begin lp_style.css ===== */
@font-face{font-family:MyYuGothicM;font-weight:400;src:local("YuGothic-Medium")}@font-face{font-family:MyYuGothicM;font-weight:700;src:local("YuGothic-Bold")}[data-view*=sp]{display:none}[data-view*=tablet]{display:none}[data-view*=pc]{display:block}[data-view*=pc-inlineblock]{display:inline-block}.c032{position:relative;font-family:MyYuGothicM,YuGothic,-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;box-sizing:border-box;z-index:10}.c032.astro-ST47F3K6{font-family:inherit}.c034{padding:40px 50px;background-color:#f1f1f1;text-align:left}.c034 p{line-height:1.6}.c036{margin-bottom:20px;width:270px}.c035{position:absolute;top:40px;right:50px;display:inline-block;color:#000!important;font-size:16px;text-decoration:underline}.c033{padding:5px 0;background-color:#beb79a;color:#fff;text-align:center;font-size:12px}@media screen and (max-width:1024px){[data-view*=pc]{display:none}[data-view*=pc-inlineblock]{display:none}[data-view*=tablet]{display:block}[data-view*=tablet-inlineblock]{display:inline-block}.c034{padding:30px 5%}.c035{position:relative;top:auto;right:auto;margin-top:20px}}@media screen and (max-width:767px){[data-view*=pc]{display:none}[data-view*=pc-inlineblock]{display:none}[data-view*=tablet]{display:none}[data-view*=tablet-inlineblock]{display:none}[data-view*=sp]{display:block}[data-view*=sp-inlineblock]{display:inline-block}}
/* ===== End lp_style.css ===== */


/* ===== Begin header.css ===== */
#header .right{
    float:right;
    margin-bottom:10px;
}#header .c037ead_navi li.active img{
    margin-top:-40px;
}#header .c037ead_navi li.active a img{
    margin-top:-40px;
}#header .c037ead_navi .active img{
    margin-top:-40px;
}#header input[type="button"],input[type="submit"]{
    -webkit-appearance: none;
}
/* ===== End header.css ===== */


/* ===== Begin header_responsive.css ===== */

@media screen and (max-width: 768px) {#header #search-area .c040{
		padding: 20px 10px;
	}
}
@media screen and (max-width: 768px) {
}
/* ===== End header_responsive.css ===== */



/* =========================================================
   LINE相談誘導（追加）
   - hrefは __LINE_URL__ を後で差し替えてください
   ========================================================= */
.line-consult{
  padding: 26px 16px;
  background: #fff;
}
.line-consult__inner {
    max-width: 920px;
    margin: 40px auto;
    padding: 22px 18px;
    /* border: 1px solid rgba(0, 0, 0, .08); */
    border-radius: 16px;
    /* box-shadow: 0 10px 28px rgba(0, 0, 0, .06); */
    text-align: center;
    background: linear-gradient(180deg, rgb(255 243 221 / 25%), rgb(171 255 65 / 13%));
    /* border-color: #25c52826; */
}

.line-consult__label{
  display: inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: .08em;
  border: 1px solid rgba(0,0,0,.10);
  margin: 0 0 10px;
}
.line-consult__title{
  font-size: 18px;
  line-height: 1.5;
  margin: 0 0 12px;
}
.line-consult__points{
  margin: 0 auto 16px;
  padding: 0 0 0 18px;
  line-height: 1.8;
  font-size: 14px;
  max-width: 560px;
  text-align: left;
  display: inline-block;
}
.line-consult__btn{
  display: flex !important;
  width: fit-content;
  margin: 0 auto;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 700;
  padding: 18px 36px;
  font-size: 17px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.08);
  background: #06C755;
  color: #fff;
      /* box-shadow: 0 10px 18px rgba(0, 0, 0, .10); */
    transition: opacity .2s ease, transform .2s ease;
}
.line-consult__btn:hover{
  opacity: 0.85;
  transform: translateY(-1px);
}
.line-consult__btn-inner{
  display: flex;
  align-items: center;
  gap: 10px;
}
.line-consult__icon{
  width: 22px;
  height: 22px;
  display: block;
}
.line-consult__note{
  margin: 10px 0 0;
  font-size: 12px;
  opacity: .75;
}

/* 位置ごとの余白微調整 */
.line-consult--top{ padding-top: 10px; }
.line-consult--mid{ padding-top: 18px; }
.line-consult--prelineup{ padding-top: 18px; padding-bottom: 18px; }

@media (min-width: 768px){
  .line-consult{ padding: 34px 16px; }
  .line-consult__inner{ padding: 28px 26px; }
  .line-consult__title{ font-size: 20px; }
  .line-consult__points{ font-size: 15px; }
  .line-consult__btn{ max-width: 420px; }
}


/* =========================================================
   公式サイトリンク（わかりやすく）
   ========================================================= */
.official-link{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.15);
  background: rgba(255,255,255,0.7);
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.2;
}
.official-link:hover{
  opacity: 0.85;
}
.official-link__icon{
  font-size: 14px;
  line-height: 1;
}
@media screen and (max-width: 768px){
  .official-link{
    display: inline-flex;
    margin-left: 0;
    margin-top: 6px;
  }
}


/* アイコン崩れ防止 */
.line-btn-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.line-icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  display: block;
}

/* ボタンを横長に */
.line-btn {
  padding: 18px 44px;
  min-width: 320px;
  justify-content: center;
}

/* 最下部LINE問い合わせ 念のため中央寄せ */
#line-inquiry {
  text-align: center;
}

#line-inquiry .line-btn {
  margin: 0 auto;
}


/* ===== other01〜04 odd/even fix ===== */
.hk-otherGroup > .c061:nth-child(odd) .c067:after{
  right: -208%;
}
.hk-otherGroup > .c061:nth-child(even) .c067{
  margin-right: 2%;
  text-align: right;
  display: block;
}
.hk-otherGroup > .c061:nth-child(even) .c067:after{
  left: -168%;
}

figure.c039 {
    width: 30%;
    margin: 0 auto;
}
	


.box5 {
    max-width: 720px;
	color: #aea536;
        padding: 2em 1em;
    margin: 6em 24em;
    border: double 5px #f9f7e0;
}

.box5 p {
    line-height: 1.8;
    font-size: 14px;
    text-align: left;
}

@media (max-width: 768px) {

  #kuyo,
  #kuyo p,
  .box5,
  .box5 p {
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    white-space: normal !important;
  }

  #kuyo,
  .box5 {
    width: auto !important;
    max-width: 100% !important;
    margin: 14px !important;
    padding: 20px 16px !important;
    position: static !important;
  }

  .box5 p {
    font-size: 13px;
    line-height: 1.8;
  }
}

.ul {
  text-decoration: underline;
    color: #aea536;
    font-size: 14px;
}
.heading-27 {
    display: flex;
    align-items: center;
    column-gap: 8px;
    color: #757575;
}

.heading-27::before {
    width: 0.8em;
    height: 0.4em;
    border-bottom: 2px solid #a9da4e;
    border-left: 2px solid #a9da4e;
    transform: rotate(-45deg) translate(2px, -2px);
    content: '';
}
.n-se {
    display: flex;
    flex-direction: column;
    align-items: center; /* 全体を中央へ */
    text-align: left; /* 文字は左揃え */
    gap: 6px;
    padding: 40px 20px;
}

/* 見出し整形 */
.n-se .heading-27 {
    max-width: 600px;
    width: 100%;
    line-height: 1.6;
}

/* スマホ最適化 */
@media (max-width: 768px) {
    .n-se {
        padding: 10px 12px;
        gap: 4px;
    }

    .n-se .heading-27 {
        font-size: 13px;
        line-height: 1.6;
    }
}

.message {
  max-width: 520px;
  margin: 0 auto 16px;
  line-height: 1.9;
  text-align: left;
	font-size: 14px;
}

@media (max-width: 768px) {
  .message {
    max-width: 100%;
    line-height: 1.8;
    padding: 0 16px;
	  font-size: 13px;
  }
}
.sp-break { display: inline; }

@media (max-width: 768px){
  .sp-break { display: block; }
}