@charset "UTF-8";
@import "reset5.css";
@import "../font/segment/segment.css";

body { color:#1f1d1e; line-height:1; padding: 0; position: relative; min-height: 100%; background: #fff }
html { min-height: 100%; }

* {word-wrap: break-word; }
img { -ms-interpolation-mode: bicubic; }
body { font-size: 15px; letter-spacing: 0.06em; font-family: Segment, Segoe, yo-gothic-plusn, Helvetica, Arial, Sans-Serif }
p, th, td, dt, dd { line-height: 1.8; font-weight: 400 }
h2, h3, h4, h5 { font-family: segment, Segoe, ryo-gothic-plusn, Helvetica, Arial, Sans-Serif; letter-spacing: 0.06em; font-weight: 700; font-style: normal }

.serif { font-family: big-caslon-fb, serif; }
.mincho { font-family: YuMincho, 'Yu Mincho', serif;}

/* !clearfix */
hr { display: none; }

.cfix { zoom:1; }
.cfix:after{
    content:"";
    clear:both;
    display:block;
    height:0;
}

/* スクロールバーの有無によるズレ対策 */
html {
	overflow-y: scroll;
}

img { vertical-align: bottom; }

.ts-larger { font-size: 1.12em !important }
.ts-smaller { font-size: 0.88em !important }

.fltR { float: right; }
.fltL { float: left; }

.txtR { text-align: right; }
.txtL { text-align: left; }
.txtC { text-align: center; }

.pc_none { display: none }
.sp_none { display: block }


/* !Links */
a { cursor: pointer !important }
a:link { color: #1f1d1e; text-decoration: none }
a:visited { color: #1f1d1e; text-decoration: none }
a:not(.greyout):hover { color: #99836f; text-decoration: underline }
a:not(.greyout):active { color: #cc1c7d; text-decoration: none }
a.greyout { opacity: 0.33 }

i { font-style: italic !important }
.rd { color: crimson }
.pk { color: #cc1c7d }


html {  }
#wrapper { position: relative; width: 100%; text-align: left; min-height: 100%; overflow: hidden; z-index: 0 }

/* リストの高さ揃える  */
.list-flex { display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

/* effects */
.fd { position: relative; opacity: 0; transform: translateY(8vw); transition: opacity 1.2s linear, transform 1s cubic-bezier(0.19, 1, 0.22, 1) }
.fd.active { opacity: 1; transform: translateY(0); }
.fd.active .ln { width: 60% !important; }
.vis { opacity: 0; filter: sepia(1); transform: rotateY(7.5deg) rotateZ(7.5deg) translateY(6vw) skewY(-7.5deg); transition: filter 1.2s ease-in, opacity 1.2s linear, transform 1.2s cubic-bezier(0.19, 1, 0.22, 1); }
.vis.active { opacity: 1; filter: grayscale(0); transform: rotateY(0deg) rotateZ(0deg) translateY(0) skewY(0deg); }
.zm { opacity: 0; transform: scale(1.2); transition: all 1s }
.zm.active { opacity: 1; transform: scale(1); }
.txtl, .txtl-t, .txtl-t2, .txts { position: relative; opacity: 0; padding: 0; margin: 0; display: block; letter-spacing: 0.072em !important }
.delay-0 { transition-delay: 0.2s; }
.delay-1 { transition-delay: 0.16s; }
.delay-2 { transition-delay: 0.32s; }
.delay-3 { transition-delay: 0.48s; }
.delay-4 { transition-delay: 0.64s; }

/* LANG */
body.lang-en .en { display: block }
body.lang-en .jp { display: none }
body.lang-jp .en { display: none }
body.lang-jp .jp { display: block }

#loader { position: fixed; left: 50%; top: 50%; margin: -16px 0 0 -16px; z-index: 1000 }
.loader svg {
	fill: none;
	stroke: #4d4d4d ;
	stroke-width: 10;
	stroke-linecap: round;
	stroke-dasharray: 230 230;
	animation: loader 1.4s infinite cubic-bezier(.4,0,.3,1), loading 1.2s infinite linear;
	vertical-align: middle;
}
@keyframes loader {
	from { stroke-dashoffset: 230; }
	to { stroke-dashoffset: -230; }
}
@keyframes loading {
	from { transform: none; }
	to { transform: rotate(360deg); }
}

/* header */
#header { position: absolute; left: 0; top: 0; width: 100%; height: 90px; z-index: 100 }
.lower #header { border-bottom: solid 1px #f0efee }
#header h1 { padding: 22px 0; text-align: center }
.lower #header h1 { padding: 27px 0 }
.lower #header h1 img { height: 46px }
#header .lang { position: absolute; left: 20px; top:22px; line-height: 46px }
#header .lang li { display: inline-block }
#header .lang li:first-child::after { content: "|"; display: inline-block; font-weight: 200; color: #c0bbb7; }
#header .lang li a { display: inline-block; color: #c0bbb7; padding: 0 0.66em }
#header .lang li.active a { color: #1f1d1e; }
#home #header .lang li a { color: #fff }
#header .link-sl { position: absolute; right: 120px; top: 22px; line-height: 46px }
#header .link-sl a { position: relative; display: block; padding-left: 2em }
#header .link-sl a::before { content: ""; position: absolute; left: 0; top: 0; width: 14px; height: 46px; background: url(../img/ico_locator.svg) no-repeat center center; background-size: contain }
#home #header .link-sl a { color: #fff }
#home #header .link-sl a::before { background: url(../img/ico_locator_w.svg) no-repeat center center; }
#btn-menu { position: fixed; right: 0; top: 0; width: 100px; height: 90px; cursor: pointer; z-index: 100 }
#btn-menu span { position: absolute; display: block; width: 50px; height: 2px; background: #1f1d1e; transition: all 0.2s }
#btn-menu span:nth-child(1) { left: 25px; top: 39px }
#btn-menu span:nth-child(2) { left: 25px; bottom: 39px }
#btn-menu:hover span { width: 60px; }
#btn-menu:not(.active):hover span:nth-child(1) { left: 20px; top: 39px }
#btn-menu:not(.active):hover span:nth-child(2) { left: 20px; bottom: 39px }
#btn-menu.active:hover span:nth-child(1) { left: 20px; top: 39px }
#btn-menu.active:hover span:nth-child(2) { left: 20px; bottom: 39px }
#btn-menu.active span:nth-child(1) { transform: rotate(45deg) scaleX(0.5); background: #fff }
#btn-menu.active span:nth-child(2) { transform: rotate(-45deg) scaleX(0.5) translate(13px, -7px); background: #fff }
#btn-menu.w span { background: #fff }

/* m-menu */
#m-menu { position: fixed; width: 50%; height: 100vh; right: -55%; top: 0; background: #1f1d1e; mix-blend-mode: multiply; transform: rotateY(2.5deg) rotateZ(2.5deg) skewY(-2.5deg); transition: all 0.6s cubic-bezier(0.85, 0, 0.15, 1); z-index: 100 }
#m-menu.active { transform: rotateY(0) rotateZ(0) skewY(0); right: 0; }
#m-menu ul { margin: 6vw }
#m-menu ul li:nth-child(8) { border-top: solid 1px #99836f; margin-top: 2.9vw }
#m-menu ul li a { display: block; margin: 0.5em; font-size: 55px; font-weight: 600; letter-spacing: 0.072em; }
#m-menu ul li:nth-child(8) a, #m-menu ul li:nth-child(9) a { font-size: 44px; }
#m-menu ul li a:link, #m-menu ul li a:visited { color: #fff }
#m-menu ul li a:not(.greyout):hover { color: #99836f }

/* main */
#mv { opacity: 0.1; transition: all 1s; background: #000 }
#mv.active { opacity: 1 }
#mv video { width: 100%; background: #000 }
#mv .mv-inner { z-index: 0 }
.global-nav { position: fixed; left: 0; top: -90px; width: 100%; height: 90px; background: #fff; z-index: 100; transition: all 0.4s }
.global-nav.active { top: 0 }
.global-nav li { display: inline-block; }
.global-nav .g-nav { padding-left: calc(5.6vw - 20px) }
.global-nav .g-nav li a { display: block; line-height: 90px; padding: 0 20px }
.global-nav .sns { position: absolute; right: 100px; top: 20px }
.global-nav .sns li a { display: block; transition: all 0.2s }
.global-nav .sns li a:hover { transform: scale(1.12) }

video#vd0 {
    width: 100vw;
}

.contents { position: relative; padding-bottom: 13.2vw;     padding: 8.7vw 0; }
.lower .contents { margin-top: 90px; padding-bottom: 13.2vw }
.top-sec { position: relative; padding: 16vw 0 0 }
.top-look { position: relative }
#top-concept { padding: 8.7vw 0 }
#top-concept .sec-inner { position: relative; padding: 5.8vw 4.4vw 6.6vw; text-align: center }
#top-concept .sec-inner .ln-t { position: absolute; display: block; left: 20%; top: 0; width: 0; height: 1px; background: #4d4d4d; transition: all 1.2s }
#top-concept .sec-inner .ln-b { position: absolute; display: block; right: 20%; bottom: 0; width: 0; height: 1px; background: #4d4d4d; transition: all 1.2s }
#top-concept .sec-inner .logo { position: absolute; left: 6.4vw; top: 33.33%; width: 82.5vw; opacity: 0; transition: all 2s ease-in; z-index: 0 }
#top-concept .sec-inner .logo.active { opacity: 1; }
#top-concept h2 { font-size: 100px; font-weight: 700 }
#top-concept .read { margin-top: 3em }
#top-concept .read p { font-size: 16px; font-weight: 600; }
#top-concept .read p:first-child { line-height: 3em; margin-bottom: 3em }
#top-look .look { position: relative; }
#top-look .look img { position: relative; }
#top-look .look01, #top-look .look03 { margin-bottom: -1px }
#top-look .look.look01:first-child {
    padding-bottom: 8.7vw;
}
#top-look .look01 .txt-box { position: absolute; left: 0; top: 66.66%; width: 100%; text-align: center; color: #fff; z-index: 1 }
#top-look .look01 .txt-box h2 { font-size: 72px; margin-bottom: 0.66em }
#top-look .look01 .txt-box p { font-size: 16px; font-weight: 500; }
#top-look .look02 img { float: left ;aspect-ratio: 4 / 3;
    object-fit: cover;}
#top-look .look03 { padding-top: 4.4vw }
#top-look .look03 img { float: left }
#top-look .look04 {  }
#top-look .look04 .txt-box { position: absolute; left: 0; top: calc(50% - 3em); width: 100%; text-align: center; color: #fff; z-index: 1 }
#top-look .look04 .txt-box h2 { font-size: 72px; margin-bottom: 0.66em }
#top-look .look04 .txt-box p { font-size: 15px; font-weight: 500; }
#top-look .look06 { 
    /* padding: 4.4vw 0 ;      */
    height: 450px;
}
#top-look .look06 img { float: left; float: left;
    object-fit: cover;
    height: 100% ! IMPORTANT;}
#top-look .look06 .txt-box { position: absolute; left: 0; top: calc(50% - 1em); width: 100%; text-align: center; color: #fff; z-index: 1 }
#top-look .look06 .txt-box p { font-size: 20px; font-weight: 500; }
#top-look .look07 .txt-box { position: absolute; left: 0; top: 90.5%; width: 100%; text-align: center; color: #fff; z-index: 1 }
#top-look .look07 .txt-box h2 { font-size: 72px; margin-bottom: 1em }
#top-look .look07 .txt-box p { font-size: 15px; font-weight: 500; color: #000 }
#top-look .look07 .txt-box p:last-child { margin-top: 2em }

#top-productmovie { padding: 16vw 0 0; }
#top-productmovie h2 { font-size: 44px; text-align: center; margin-bottom: 0.8em }
#top-productmovie .pmov-idx li { float: left; width: calc(33.33% - 1px); margin-right: 1px }
#top-productmovie .pmov-idx li:last-child { margin-right: 0 }
#top-productmovie .pmov-idx li a { position: relative; display: block; }
#top-productmovie .pmov-idx li a::after { content: ""; display: block; position: absolute; right: 15px; bottom: 15px; width: 30px; height: 30px; background: url("../img/ico_arw.png") no-repeat; background-size: contain }
#top-productmovie .pmov-idx li a .vis { position: relative; overflow: hidden; background: #1f1d1e }
#top-productmovie .pmov-idx li a img { transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1) }
#top-productmovie .pmov-idx li a:hover img { opacity: 0.33; transform: scale(1.08); }

#top-collection { padding: 16vw 0 0 }
#top-collection h2 { font-size: 44px; text-align: center; margin-bottom: 0.8em }
#top-collection .col-idx li { float: left; width: 50% }
#top-collection .col-idx li a { position: relative; display: block; }
#top-collection .col-idx li a .vis { position: relative; overflow: hidden; background: #1f1d1e }
#top-collection .col-idx li a img { transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1) }
#top-collection .col-idx li a:hover img { opacity: 0.33; transform: scale(1.08); }
#top-collection .col-idx li a h3 { position: absolute; left: 5.6vw; bottom: 2.9vw; font-size: 40px; font-weight: 600; color: #fff }
.item-search { padding: 7.5vw 5.6vw 0; text-align: center }
.item-search h3 { position: relative; font-size: 32px; color: #c0bbb7; margin: 0 auto 2.9vw; display: inline-block; }
.item-search .col-cat { margin: 0 -3.3vw }
.item-search .col-cat li { float: left; width: calc(50% - 6.6vw); margin: 0 3.3vw }
.item-search .col-cat li .vis { border-top: solid 1px #bfbab7; overflow: hidden }
.item-search .col-cat li .vis img { transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1) } 
.item-search .col-cat li h4 { font-size: 24px; text-align: center; }
.item-search .col-cat li a { display: block }
.item-search .col-cat li a:hover .vis { border-top: solid 1px #1f1d1e; }
.item-search .col-cat li a:hover img { transform: scale(1.08); }
.item-search .tags { margin-top: 4.4vw; text-align: center }
.item-search .tags h4 { display: inline-block; padding: 1em 0 2em; margin: 0 auto; font-size: 14px; font-weight: 400; text-align: center; border-top: solid 1px #bfbab7 }
.item-search .tags ul { margin: 0 -2px }
.item-search .tags ul li { float: left; width: calc(20% - 4px); margin: 2px }
.item-search .tags ul.col-material li { width: calc(33.33% - 4px); }
.item-search .tags ul li a { display: block; padding: 1em; border: solid 1px #bfbab7; border-radius: 4px }
.item-search .tags ul li a:hover { border: solid 1px #1f1d1e }

#footer { padding: 0 5.8vw }
#footer .footer-inner { padding: 4.4vw 2.2vw; border-top: solid 1px #cdcccc }
#footer .footer-inner .f-nav ul { margin-left: -1em }
#footer .footer-inner .f-nav li { display: inline-block; font-size: 18px; font-weight: 100; color: #cdcccc }
#footer .footer-inner .f-nav li a { font-weight: 700; padding: 0 1em }
#footer .footer-inner .f-sns { margin: 2em 0 4em }
#footer .footer-inner .f-sns h4 { float: left; font-size: 18px; line-height: 50px; margin-right: 1em }
#footer .footer-inner .f-sns ul { float: left; }
#footer .footer-inner .f-sns ul li { display: inline-block; }
#footer .footer-inner .f-sns ul li a { display: block; transition: all 0.2s }
#footer .footer-inner .f-sns ul li a:hover { transform: scale(1.12) }
#footer .footer-inner .copyright { }
#footer .footer-inner .copyright p { line-height: 50px }

#lay { position: fixed; left: 0; top: 0; width: 100%; height: 100vh; background: rgba(0,0,0,0.9); z-index: 1000; display: none }
#lay .lay-inner { margin-top: calc((100vh - 100vw * (9 / 16)) * 0.5) }
#close-btn { position: absolute; right: 0; top: 0; width: 100px; height: 90px; cursor: pointer; z-index: 100 }
#close-btn span { position: absolute; display: block; width: 50px; height: 2px; background: #1f1d1e; transition: all 0.2s }
#close-btn span:nth-child(1) { left: 25px; top: 39px; transform: rotate(45deg) scaleX(0.5); background: #fff }
#close-btn span:nth-child(2) { left: 25px; bottom: 39px; transform: rotate(-45deg) scaleX(0.5) translate(13px, -7px); background: #fff }
#close-btn:hover span { width: 60px; }
#close-btn:hover span:nth-child(1) { left: 20px; top: 39px }
#close-btn:hover span:nth-child(2) { left: 20px; bottom: 39px }


/* LOWER CONTENTS */
.bigtit { padding: 0 5.8vw }
.bigtit h2 { position: relative; font-size: 48px; text-align: center; line-height: 1em; padding: 80px 0; border-bottom: solid 1px #cdcccc; opacity: 0 }
.sec { padding: 8.7vw 0 0 }
.sec-inner { padding: 0 5.8vw }

/* COLLECTION */
.collection-idx { text-align: center }
.collection-idx h2 { font-size: 36px; line-height: 1em; }
.collection-idx h2 span { display: block; font-size: 12px; font-weight: 400; letter-spacing: 0.04em; margin: 0; padding: 0 }
.collection-idx h3 { font-size: 24px; line-height: 1em; font-weight: 600; border-bottom: solid 1px #cdcccc; display: inline-block; margin: 0 auto }
.collection-idx li { width: 33.33% }
.collection-idx li a { display: block; padding: 2.9vw }
.collection-idx li a .thumb { overflow: hidden }
.collection-idx li a .thumb img { transition: all 0.2s }
.collection-idx li a p { font-size: 16px; font-weight: 500; margin-top: 1em }
.collection-idx li a:hover .thumb img { transform: scale(1.08); opacity: 0.5 }
.collection-idx li.soldout { opacity: 0.2; filter: grayscale(1)}
.sunglass { padding: 2.9vw 0 0 }
.optical { padding: 7.2vw 0 0 }
.collection-bottom { position: relative; margin-top: 8.7vw; border-bottom: solid 1px #f0efee }
.collection-bottom .btn-search { position: relative; border-top: solid 1px #f0efee; }
.collection-bottom .btn-search a { position: relative; display: block; padding: 80px 0; font-size: 24px; font-weight: 600; text-align: center; z-index: 1 }
.collection-bottom .btn-search a h3 { position: relative; display: inline-block; padding-left: 40px }
.collection-bottom .btn-search a h3::before { content: ""; position: absolute; display: block; width: 24px; height: 24px; left: 0; top: 0; background: url("../img/ico_search.png") no-repeat; background-size: contain }
.collection-bottom .btn-search .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #f7f6f6; transition: all 0.4s; z-index: 0 }
.collection-bottom.opened .btn-search .bg { height: 0 }
.collection-bottom .item-search { position: relative; padding: 0 5.6vw 3.6vw; display: none }
.collection-bottom .btn-close { position: absolute; right: 0; top: 0; width: 100px; height: 90px; cursor: pointer; z-index: 100 }
.collection-bottom .btn-close span { position: absolute; display: block; width: 50px; height: 2px; background: #1f1d1e; transition: all 0.2s }
.collection-bottom .btn-close span:nth-child(1) { left: 25px; top: 39px; transform: rotate(45deg) scaleX(0); }
.collection-bottom .btn-close span:nth-child(2) { left: 25px; bottom: 39px; transform: rotate(-45deg) scaleX(0) translate(13px, -7px); }
.collection-bottom .btn-close.active span:nth-child(1) { transform: rotate(45deg) scaleX(0.5); }
.collection-bottom .btn-close.active span:nth-child(2) { transform: rotate(-45deg) scaleX(0.5) translate(13px, -7px); }
.collection-bottom .btn-close.active:hover span:nth-child(1) { left: 20px; top: 39px; width: 60px; }
.collection-bottom .btn-close.active:hover span:nth-child(2) { left: 20px; bottom: 39px; width: 60px; }
.collection-detail { text-align: center; }
.collection-detail h2 { font-size: 48px; line-height: 1em }
.collection-detail h2 span { display: block; font-size: 12px; font-weight: 400; letter-spacing: 0.04em; margin: 0; padding: 0 }
.collection-detail .item-box { padding: 40px 16.66% 0; }
.collection-detail .item-box .items { position: relative }
.collection-detail .item-box .items li { position: absolute; left: 0; top: 0; opacity: 0; transition: opacity 0.8s }
.collection-detail .item-box .items li.active { opacity: 1 }
.collection-detail .item-box .items li:first-child { position: relative; left: inherit; top: inherit }
.collection-detail .item-box .items li .pic { transform: translateY(2.9vw); transition: all 0.8s }
.collection-detail .item-box .items li.active .pic { transform: translateY(0); }
.collection-detail .item-box .items li p { font-size: 15px; margin-top: 2em }
.collection-detail .thumbs { margin: 5.8vw auto 0; max-width: 1300px }
.collection-detail .thumbs li { float: left; width: 16.66%; }
.collection-detail .thumbs li a { position: relative; display: block; padding: 6px 1.6vw }
.collection-detail .thumbs li a .ln { position: absolute; right: 0; top: 0; width: 1px !important; height: 100%; background: #c0bbb7 }
.collection-detail .thumbs li a .bg { position: absolute; left: 0; top: 0; width: 0; height: 100%; background: #f0efee; mix-blend-mode: multiply; transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1); }
.collection-detail .thumbs li:not(.active) a:hover .bg { width: 100% }
.collection-detail .thumbs li.active a .bg { width: 100% }
.pager { position: relative; text-align: center; border-top: solid 1px #f0efee; margin-top: 8.7vw }
.pager a.backto { display: block; padding: 32px 0; font-size: 24px; font-weight: 600; border-top: solid 1px #f0efee }
.pager .prev { position: absolute; left: 0; top: -1px; width: 25%; text-align: left }
.pager .prev a { position: relative; display: block; padding: 32px 2.9vw; font-size: 18px; font-weight: 600; border-top: solid 1px #bfbab7; }
.pager .prev a .thumb { position: absolute; right: 24px; top: 12px; transition: all 0.2s }
.pager .next { position: absolute; right: 0; top: -1px; width: 25%; text-align: right }
.pager .next a { position: relative; display: block; padding: 32px 2.9vw; font-size: 18px; font-weight: 600; border-top: solid 1px #bfbab7; }
.pager .next a .thumb { position: absolute; left: 24px; top: 12px; transition: all 0.2s }
.pager .prev a:hover, .collection-nav .next a:hover { border-top: solid 1px #1f1d1e }
.pager .prev a:hover .thumb, .collection-nav .next a:hover .thumb { transform: scale(1.08); opacity: 0.5 }
p.soldout { font-weight: 500; margin-top: 1em }
p.comingsoon { padding: 6em 0 16em }

/* ABOUT */
.img-l .vis { float: left; width: calc(50% - 2.9vw) }
.img-l .txt { float: right; width: calc(50% - 8.7vw); padding: 0 5.8vw 0 2.9vw }
.img-r .vis { float: right; width: calc(50% - 2.9vw) }
.img-r .txt { float: left; width: calc(50% - 8.7vw); padding: 0 2.9vw 0 5.8vw }
.img-l .txt h3, .img-r .txt h3 { font-size: 60px; margin-bottom: 1em }
.img-l .txt p, .img-r .txt p { font-size: 16px }

/* ARCHIVE */
.archives .sec-inner { padding: 0 11.6vw  }
.archive a { display: block }
.archive a .bnr { overflow: hidden }
.archive a .bnr img { transition: all 0.2s }
.archive a:hover .bnr img { transform: scale(1.08); opacity: 0.5 }
.archive h3 { font-size: 24px; margin-top: 1em }

/* NEWS */
.news-idx .sec-inner { padding: 0 11.6vw  }
.news-idx li { margin-top: 5.8vw }
.news-idx li:first-child { margin-top: 0 }
.news .bnr { float: left; width: 50%; overflow: hidden }
.news .bnr a { display: block }
.news .bnr a img { transition: all 0.2s }
.news .bnr a:hover img { transform: scale(1.08); opacity: 0.5 }
.news .cont { float: right; width: calc(50% - 5.8vw) }
.news .cont h3 { font-size: 24px; line-height: 1.5em; margin-bottom: 0.33em }
.news .cont time { font-style: italic; line-height: 2em; }
.news .cont p { margin-top: 2em }
.news-detail .sec-inner { padding: 0 11.6vw  }
.news-detail .news-detail-inner { max-width: 960px; margin: 0 auto }
.news-detail .news-detail-inner .cont { padding: 2.9vw 1.6vw }
.news-detail .news-detail-inner .cont h3 { font-size: 32px; line-height: 1.5em; margin-bottom: 0.33em }
.news-detail .news-detail-inner .cont time { font-style: italic; line-height: 2em; }
.news-detail .news-detail-inner .cont p { margin-top: 2em }
.txt-link { font-size: 18px; font-weight: 500 }
.txt-link a { display: inline-block }
.txt-link a::after { content: ">"; font-weight: 900; display: inline-block; margin-left: 1em }

/* STORE LOCATOR */
.store-locator .search_filter { color: #1f1d1e !important }
.store-locator .search_filter p { font-size: 18px !important; color: #1f1d1e !important; font-weight: 700 !important; margin-bottom: 0.5em !important; }
#asl-storelocator.asl-p-cont.asl-bg-0 .search_filter .form-control {
    border-radius: 2em !important;
    border-right: 0 !important;
    border: none !important;
    box-shadow: none !important;
    display: block;
    margin-right: 0;
    width: calc(100% - 2em); border: none !important; border-radius: 2em !important; padding: 0 1em !important; background: #eae8e7 !important
}
#asl-storelocator.asl-p-cont:not(.asl-template-2) input#auto-complete-search {
    min-height: inherit !important;
    line-height: 4em !important;
}
#asl-storelocator.asl-p-cont .inside.search_filter .form-control {
    border: none !important;
}
#asl-storelocator.storelocator-main.asl-p-cont.asl-bg-0 #panel.storelocator-panel {
    border: none !important;
}
#asl-storelocator.asl-p-cont.asl-bg-0 .inside.search_filter {
    color: ##1f1d1e !important;
    border: none !important;
}
#asl-storelocator.asl-p-cont.asl-bg-0 .Num_of_store { font-size: 16px !important; background: none !important; text-align: left !important }
#asl-storelocator.asl-p-cont.asl-bg-0 .inside.search_filter {
    border: none !important;
}
#asl-storelocator.asl-p-cont.asl-bg-0 #panel .item-state a span {
    background: none !important;
    color: #1f1d1e !important;
    cursor: pointer;
    display: block;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 0.66em 0 !important;
    text-indent: 0.5em !important;
    width: 100%;
    border-bottom: solid 1px #dfdcda !important;t
}
#asl-storelocator.storelocator-main.asl-p-cont.asl-bg-0 #panel .item-state a.collapsed span {
    border-bottom: dotted 1px #dfdcda !important;
}
#asl-storelocator.storelocator-main.asl-p-cont.asl-bg-0 .panel-inner .item .addr-sec .p-title {
    font-size: 14px !important;
    color: #1f1d1e;
    font-weight: 500;
}
#asl-storelocator.storelocator-main.asl-p-cont.asl-bg-0 .panel .item {
    padding-top: 1em  !important;
    background: #f7f7f7 !important;
    border-radius: 4px;
    font-size: 12px !important;
}


/* COTACT */
.contact .sec-inner { padding: 0 23.2vw  }
.contact .sec-inner p { margin-bottom: 40px }
.contact .sec-inner p .hd { display: inline-block; font-size: 18px; font-weight: 500; margin-bottom: 0.66em }
.contact .sec-inner p .hd span.anno { font-size: 15px; font-weight: 400 }
.contact .sec-inner input { width: calc(100% - 2em); border: none; line-height: 4em; border-radius: 2em; padding: 0 1em; background: #eae8e7 }
.contact .sec-inner textarea { width: calc(100% - 2em); border: none; line-height: 2em; border-radius: 2em; padding: 0 1em; background: #eae8e7 }
.contact .sec-inner .btn-submit { border: solid #dfdcda; border-width: 1px 0 }
.contact .sec-inner .btn-submit:hover { background: #eae8e7 }
.contact .sec-inner input[type="submit"] { background: none; line-height: 1em; font-size: 20px; font-weight: 700; padding: 1.5em 0; }

/* OTHER */
.other .sec-inner { padding: 0 11.6vw  }
.other .other-detail { max-width: 960px; margin: 0 auto }
.other .other-detail h3 { font-size: 32px; line-height: 1.5em; margin-bottom: 1em; }

.tbl-eq { }
.tbl-eq th { padding: 1em 2em; border-bottom: solid 1px #faf7f7; vertical-align: top; font-weight: 500 }
.tbl-eq th.hd { font-size: 14px; padding: 1em; border-bottom: solid 1px #faf7f7; }
.tbl-eq td { font-size: 14px; padding: 1em; border-bottom: solid 1px #dad7d7 }
.tbl-eq td.bw { border-bottom: solid 1px #faf7f7; }

.tx-larger { font-size: 1.22em }
.tx-smaller { font-size: 0.88em }
.mt-1 { margin-top: 1em }
.mt-2 { margin-top: 2em }
.mt-4 { margin-top: 4em }



@media screen and (max-width: 780px) {
	
    body { font-size: 13px; letter-spacing: 0.04em; -webkit-text-size-adjust: none; overflow: hidden }
    h2, h3, h4, h5 { letter-spacing: 0.04em; font-weight: 700; }
	
    a { text-decoration:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-touch-callout:none; }

    .pc_none { display: block }
    .sp_none { display: none }
    
    /* effects */
    .fd .fd-inner { position: relative; top: 6vw }
    .fd.active .ln { width: 80% !important; }
    .zm { transform: scale(1.24); }
    .txtl, .txtl-t { display: inline-block }
    
    #loader { margin: -12px 0 0 -12px; }
    .loader svg { width: 24px; height: 24px }
    
    #btn-menu { position: fixed; right: 0; top: 0; width: 60px; height: 42px; cursor: pointer; z-index: 100 }
    #btn-menu span { position: absolute; display: block; width: 30px; height: 2px; background: #303030; transition: all 0.2s }
    #btn-menu span:nth-child(1) { left: 15px; top: 15px }
    #btn-menu span:nth-child(2) { left: 15px; bottom: 15px }
    #btn-menu:hover span { width: 30px; }
    #btn-menu:not(.active):hover span:nth-child(1) { left: 15px; top: 15px }
    #btn-menu:not(.active):hover span:nth-child(2) { left: 15px; bottom: 15px }
    #btn-menu.active:hover span:nth-child(1) { left: 15px; top: 15px }
    #btn-menu.active:hover span:nth-child(2) { left: 15px; bottom: 15px }
    #btn-menu.active span:nth-child(1) { transform: rotate(45deg) scaleX(0.5); background: #fff }
    #btn-menu.active span:nth-child(2) { transform: rotate(-45deg) scaleX(0.5) translate(13px, -7px); background: #fff }
    
    /* header */
    #header { height: 42px; }
    #header h1 img { height: 32px }
    #header .lang { position: absolute; left: 8px; top: 8px; line-height: 30px }
    #header .lang li a { font-size: 12px }
    #header .link-sl { display: none }
    .lower #header h1 { padding: 7px 0 0 }
    .lower #header h1 img { height: 32px }
    .global-nav { display: none }
    
    /* m-menu */
    #m-menu { position: fixed; width: 100%; height: 100vh; right: -110%; top: 0;  }
    #m-menu.active { right: 0; }
    #m-menu ul { margin: 12vw 6vw }
    #m-menu ul li a { display: block; margin: 0.5em; font-size: 32px; }
    #m-menu ul li:nth-child(8) a, #m-menu ul li:nth-child(9) a { font-size: 28px; }
    
    /* main */
    #mv { position: relative; }
    #mv video { width: 100%; 
            height: 100vh;
        object-fit: cover;
    }
    
    .contents { position: relative; padding-bottom: 24vw }
    .lower .contents { margin-top: 42px; padding-bottom: 24vw }
    #top-concept { padding: 12vw 0 }
    #top-concept .sec-inner { position: relative; padding: 8vw 4vw 12vw; text-align: center }
    #top-concept .sec-inner .ln-t { position: absolute; display: block; left: 10%; top: 0; width: 0; height: 1px; background: #4d4d4d; transition: all 1.2s }
    #top-concept .sec-inner .ln-b { position: absolute; display: block; right: 10%; bottom: 0; width: 0; height: 1px; background: #4d4d4d; transition: all 1.2s }
    #top-concept .sec-inner .logo { position: absolute; left: 0; top: 50%; width: 100%; }
    #top-concept .sec-inner .logo.active { opacity: 1; }
    #top-concept h2 { font-size: 11vw; }
    #top-concept .read { margin-top: 1em }
    #top-concept .read p { font-size: 13px; font-weight: 600; }
    #top-concept .read p:first-child { line-height: 2em; margin-bottom: 1em }
    #top-look .look01 .txt-box { position: absolute; left: 0; top: 66.66%; width: 100%; text-align: center; color: #fff; z-index: 1 }
    #top-look .look01 .txt-box h2 { font-size: 24px; margin-bottom: 0.2em }
    #top-look .look01 .txt-box p { font-size: 9px; }
    #top-look .look03 { padding-top: 6vw }
    #top-look .look04 .txt-box { position: absolute; left: 0; top: calc(50% - 2em); width: 100%; text-align: center; color: #fff; z-index: 1 }
    #top-look .look04 .txt-box p { font-size: 8px; }
    #top-look .look06 { padding: 6vw 0 ;height: 200px;}
    #top-look .look06 .txt-box { position: absolute; left: 0; top: calc(50% - 1em); width: 100%; text-align: center; color: #fff; z-index: 1 }
    #top-look .look06 .txt-box p { font-size: 12px; }
    #top-look .look07 .txt-box { position: absolute; left: 0; top: 88%; width: 100%; text-align: center; color: #fff; z-index: 1 }
    #top-look .look07 .txt-box h2 { font-size: 24px; margin-bottom: 0.8em }
    #top-look .look07 .txt-box p { font-size: 11px; padding: 0 4vw }
    #top-look .look07 .txt-box p:last-child { margin-top: 1em }
    #top-look .look07 .txt-box p:last-child img { width: 50% }
    
    #top-productmovie { padding: 80vw 0 0 }
    #top-productmovie h2 { font-size: 28px; text-align: center; margin-bottom: 0.5em }
    #top-productmovie .pmov-idx li { float: none; width: 100%; margin: 0 0 1px; }
    #top-productmovie .pmov-idx li:last-child { margin: 0; }
    #top-productmovie .pmov-idx li a { text-align: center; }
    #top-productmovie .pmov-idx li a::after { content: ""; display: block; position: absolute; right: 15px; bottom: 15px; width: 24px; height: 24px; background: url("../img/ico_arw.png") no-repeat; background-size: contain }
    #top-productmovie .pmov-idx li a .vis { background: #000 }
    #top-productmovie .pmov-idx li a img { width: 80% }
    
    #top-collection { padding: 24vw 0 0 }
    #top-collection h2 { font-size: 28px; text-align: center; margin-bottom: 0.5em }
    #top-collection .col-idx li { float: none; width: 100% }
    #top-collection .col-idx li a h3 { position: absolute; left: 0; bottom: 2.9vw; font-size: 18px; width: 100%; text-align: center }
    .item-search { padding: 8vw 4vw 0 }
    .item-search h3 { font-size: 20px; }
    .item-search .col-cat { margin: 0 -2vw }
    .item-search .col-cat li { float: left; width: calc(50% - 4vw); margin: 0 2vw }
    .item-search .col-cat li .vis img { 
        /* width: 150%; */
        margin: 0 -25% } 
    .item-search .col-cat li h4 { font-size: 14px; }
    .item-search .tags { margin-top: 8vw; text-align: center }
    .item-search .tags h4 { display: inline-block; padding: 1em 0; margin: 0 auto; font-size: 12px; }
    .item-search .tags ul li { float: left; width: calc(50% - 4px); margin: 2px }
    .item-search .tags ul.col-material li { width: calc(50% - 4px); }
    .item-search .tags ul li a { font-size: 11px }
    
    #footer { padding: 0 4vw }
    #footer .footer-inner { padding: 4vw 2vw; }
    #footer .footer-inner .f-nav ul { margin-left: -0.5em }
    #footer .footer-inner .f-nav li { display: inline-block; font-size: 16px; font-weight: 100; color: #cdcccc }
    #footer .footer-inner .f-nav li a { font-weight: 700; padding: 0 0.5em; line-height: 1.66 }
    #footer .footer-inner .f-sns { margin: 1em 0 3em }
    #footer .footer-inner .f-sns h4 { float: left; font-size: 15px; line-height: 50px; margin-right: 0.5em }
    #footer .footer-inner .copyright p { font-size: 11px }
    
    #lay .lay-inner { margin-top: calc((100vh - 100vw * (16 / 9)) * 0.5) }
    #close-btn { position: absolute; right: 0; top: 0; width: 60px; height: 42px; cursor: pointer; z-index: 100 }
    #close-btn span { position: absolute; display: block; width: 30px; height: 2px; background: #1f1d1e; transition: all 0.2s }
    #close-btn span:nth-child(1) { left: 15px; top: 15px; transform: rotate(45deg) scaleX(0.5); background: #fff }
    #close-btn span:nth-child(2) { left: 15px; bottom: 15px; transform: rotate(-45deg) scaleX(0.5) translate(13px, -7px); background: #fff }
    #close-btn:hover span { width: 30px; }
    #close-btn:hover span:nth-child(1) { left: 15px; top: 15px }
    #close-btn:hover span:nth-child(2) { left: 15px; bottom: 15px }
    
    /* LOWER CONTENTS */
    .bigtit { padding: 0 }
    .bigtit h2 { font-size: 24px; padding: 40px 0; }
    .sec { padding: 12vw 0 0 }
    .sec-inner { padding: 0 4vw }
    
    /* COLLECTION */
    .collection-idx h2 { font-size: 22px; margin-bottom: 0.66em }
    .collection-idx h3 { font-size: 17px }
    .collection-idx ul { margin: 0 -2vw }
    .collection-idx li { width: 50% }
    .collection-idx li a { display: block; padding: 5vw 2vw }
    .collection-idx li a p { font-size: 14px; margin-top: 0.5em }
    .sunglass { padding: 3vw 0 0 }
    .optical { padding: 6vw 0 0 }
    .collection-bottom { margin-top: 8vw; }
    .collection-bottom .btn-search a { padding: 40px 0; font-size: 20px; }
    .collection-bottom .btn-search a h3 { position: relative; display: inline-block; padding-left: 36px }
    .collection-bottom .btn-search a h3::before { content: ""; position: absolute; display: block; width: 20px; height: 20px; left: 0; top: 0; background: url("../img/ico_search.png") no-repeat; background-size: contain }
    .collection-bottom .item-search { padding: 0 4vw 4vw; }
    .collection-bottom .btn-close { position: absolute; right: 0; top: 2px; width: 60px; height: 42px; cursor: pointer; z-index: 100 }
    .collection-bottom .btn-close span { position: absolute; display: block; width: 30px; height: 2px; background: #1f1d1e; transition: all 0.2s }
    .collection-bottom .btn-close span:nth-child(1) { left: 15px; top: 15px; transform: rotate(45deg) scaleX(0); }
    .collection-bottom .btn-close span:nth-child(2) { left: 15px; bottom: 15px; transform: rotate(-45deg) scaleX(0) translate(13px, -7px); }
    .collection-bottom .btn-close.active span:nth-child(1) { transform: rotate(45deg) scaleX(0.5); }
    .collection-bottom .btn-close.active span:nth-child(2) { transform: rotate(-45deg) scaleX(0.5) translate(13px, -7px); }
    .collection-bottom .btn-close.active:hover span:nth-child(1) { left: 15px; top: 15px; width: 30px; }
    .collection-bottom .btn-close.active:hover span:nth-child(2) { left: 15px; bottom: 15px; width: 30px; }
    .collection-detail h2 { font-size: 26px; }
    .collection-detail .item-box { padding: 40px 0 0; }
    .collection-detail .item-box .items li .pic { transform: translateY(3vw); transition: all 0.8s }
    .collection-detail .item-box .items li p { font-size: 14px; }
    .collection-detail .thumbs { margin-top: 6vw }
    .collection-detail .thumbs li { float: left; width: 25%; }
    .collection-detail .thumbs li a { position: relative; display: block; padding: 6px 2vw }
    .pager { position: relative; text-align: center; border-top: solid 1px #f0efee; margin-top: 8.7vw }
    .pager a.backto { display: block; padding: 24px 0; font-size: 16px; font-weight: 600; border-top: solid 1px #f0efee }
    .pager .prev { position: absolute; left: 0; top: -1px; width: 25%; text-align: left }
    .pager .prev a { position: relative; display: block; padding: 24px 3vw; font-size: 14px; }
    .pager .prev a .thumb { position: relative; right: inherit; top: inherit; width: 100%; margin-top: 6px; display: none }
    .pager .next { position: absolute; right: 0; top: -1px; width: 25%; text-align: right }
    .pager .next a { position: relative; display: block; padding: 24px 3vw; font-size: 14px; }
    .pager .next a .thumb { position: relative; left: inherit; top: inherit; width: 100%; margin-top: 6px; display: none }
    .pager .prev a:hover, .collection-nav .next a:hover { border-top: solid 1px #1f1d1e }
    .pager .prev a:hover .thumb, .collection-nav .next a:hover .thumb { transform: scale(1.08); opacity: 0.5 }
    
    /* ABOUT */
    #heritage { padding: 0 }
    .img-l .vis { float: none; width: 100% }
    .img-l .txt { float: none; width: calc(100% - 16vw); padding: 8vw 8vw 0 }
    .img-r .vis { float: none; width: 100% }
    .img-r .txt { float: none; width: calc(100% - 16vw); padding: 8vw 8vw 0 }
    .img-l .txt h3, .img-r .txt h3 { font-size: 32px; margin-bottom: 1em }
    .img-l .txt p, .img-r .txt p { font-size: 14px }
    
    /* ARCHIVE */
    .archives .sec-inner { padding: 0 4vw  }
    .archive h3 { font-size: 16px; margin-top: 1em }
    
    /* NEWS */
    .news-idx .sec-inner { padding: 0 4vw  }
    .news-idx li { margin-top: 8vw }
    .news-idx li:first-child { margin-top: 0 }
    .news .bnr { float: none; width: 100%; overflow: hidden }
    .news .bnr a { display: block }
    .news .cont { float: none; width: calc(100% - 8vw); padding: 8vw 4vw 0 }
    .news .cont h3 { font-size: 20px; }
    .news .cont time { font-style: italic; line-height: 2em; }
    .news .cont p { margin-top: 1em }
    .news-detail .sec-inner { padding: 0 4vw  }
    .news-detail .news-detail-inner { max-width: inherit; margin: 0 auto }
    .news-detail .news-detail-inner .cont { padding: 8vw 4vw }
    .news-detail .news-detail-inner .cont h3 { font-size: 24px; margin-bottom: 0.33em }
    .news-detail .news-detail-inner .cont time { font-style: italic; line-height: 2em; }
    .news-detail .news-detail-inner .cont p { margin-top: 2em }
    .txt-link { font-size: 16px; font-weight: 500 }
    
    /* STORE LOCATOR */
    
    /* COTACT */
    .contact .sec-inner { padding: 0 8vw  }
    .contact .sec-inner p { margin-bottom: 24px }
    .contact .sec-inner p .hd { font-size: 16px; }
    .contact .sec-inner p .hd span.anno { font-size: 14px; }
    .contact .sec-inner .btn-submit { border: solid #dfdcda; border-width: 1px 0 }
    .contact .sec-inner .btn-submit:hover { background: #eae8e7 }
    .contact .sec-inner input[type="submit"] { background: none; line-height: 1em; font-size: 17px; font-weight: 700; padding: 1.5em 0; }
    
    /* OTHER */
    .other .sec-inner { padding: 0 8vw  }
    .other .other-detail { max-width: inherit; margin: 0 auto }
    .other .other-detail h3 { font-size: 18px; }
    
    
    .tbl-eq { width: calc(100% + 16vw); overflow-x: scroll; margin: 0 -8vw; }
    .tbl-eq th { padding: 1em; border-bottom: solid 1px #faf7f7; vertical-align: top; font-weight: 500; white-space: nowrap }
    .tbl-eq th.hd { font-size: 12px; padding: 1em;  }
    .tbl-eq td { font-size: 12px; padding: 1em; border-bottom: solid 1px #dad7d7; white-space: nowrap }
    .tbl-eq td.bw { border-bottom: solid 1px #faf7f7; }
}





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

}