@charset "UTF-8";
@import "reset5.css";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap');

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

* {word-wrap: break-word; }
img { -ms-interpolation-mode: bicubic; }
/* !font-size 14px default setting */
body { font-size: 14px; letter-spacing: 0.08em; font-family: AvenirNextLTPro-Regular, 'Noto Sans JP', Helvetica, Arial, Sans-Serif }
p, th, td, li, dt, dd, span { line-height: 2.0; }
h2, h3, h4, h5 { font-family: AvenirNextLTPro-Medium, 'Noto Sans JP', Helvetica, Arial, Sans-Serif; letter-spacing: 0.16em; font-weight: 700; font-style: normal }

.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; }

.tx9 { font-size: 9px }
.tx10 { font-size: 10px }
.tx11 { font-size: 11px }
.tx12 { font-size: 12px }
.tx13 { font-size: 13px }
.tx14 { font-size: 14px }
.tx15 { font-size: 15px }
.tx16 { font-size: 16px }
.tx18 { font-size: 18px }
.tx20 { font-size: 20px }
.tx24 { font-size: 24px }

.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 }
a:link { color: #1f2a68; text-decoration: none }
a:visited { color: #1f2a68; text-decoration: none }
a:hover { color: #a7a7a7; text-decoration: underline }
a:active { color: #af9c5e; text-decoration: none }


html {  }
#loader { position: fixed; left: 50%; top: 50%; z-index: 10000 }
#wrapper { position: relative; width: 100%; text-align: left; min-height: 100%; overflow: hidden }
/* リストの高さ揃える */
.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; }
.fd .fd-inner { position: relative; top: 6vw }
.zm { transform: scale(1.24); }
.txtl, .txtl-t { opacity: 0 }

.lines { position: relative; }
.lines span { position: absolute; left: 50%; top: 0; margin-left: 0/*-100%*/; display: block; width: 0/*200%*/; height: 1px; background: #565f8d; }
.lines span:nth-child(1) { transform: rotate(11deg) }
.lines span:nth-child(2) { transform: rotate(12deg); opacity: 0.66 }
.lines span:nth-child(3) { transform: rotate(10.5deg); opacity: 0.5 }

/* main */
#to-main { position: relative; padding: 0 0 1.5vw; z-index: 0 }
#to-main h1 { position: absolute; display: block; left: 0; bottom: 0; padding: 0 0 0 3vw; z-index: 10 }
#to-main h1 img:nth-child(1) { display: inline }
#to-main h1 img:nth-child(2) { display: none }
#to-main .top-slider { position: relative; background: #a5aac6 }
#to-main .top-slider .slide { position: absolute; left: 0; top: 0; opacity: 0 }
#to-main .bot { position: absolute; left: 0; bottom: 1.5vw; z-index: 1 }
#to-main .top-nav { position: absolute; left: 6vw; top: 40%; z-index: 1 }
#to-main .top-nav ul { margin: 2em 0 0 }
#to-main .top-nav ul li:nth-child(3), #to-main .top-nav ul li:nth-child(4) { display: none }
#to-main .top-nav ul li a { font-size: 20px; font-family: AvenirNextLTPro-MediumIt, Sans-Serif; }
#to-main .top-nav ul li a:link, #to-main .top-nav ul li a:visited { color: #fff }
#to-main .lines { top: -6vw; z-index: 9 }
#to-main .lines span { left: 42% }

.contents { position: relative; padding: 6vw 0 0; z-index: 1 }

.top-concept { position: relative; margin: 0 0 11.5vw; }
.top-concept .conts { position: relative }
.top-concept .conts .slogan { position: absolute; left: 50%; top: 50%; margin: -8.8vw 0 0 -10vw; width: 20vw; height: 20vw; text-align: center; /*border: solid 2px #1f2a68;*/ z-index: 10 }
.top-concept .conts .slogan h2 { display: inline-block; font-size: 16px; line-height: 3em; padding: 4.5vw 0; text-align: left; }
.top-concept .conts .slogan .ln-tl { position: absolute; left: 0; top: 0; width: 0; height: 2px; background: #1f2a68 }
.top-concept .conts .slogan .ln-tr { position: absolute; right: 0; top: 0; width: 2px; height: 0; background: #1f2a68 }
.top-concept .conts .slogan .ln-bl { position: absolute; left: 0; bottom: 0; width: 2px; height: 0; background: #1f2a68 }
.top-concept .conts .slogan .ln-br { position: absolute; right: 0; bottom: 0; width: 0; height: 2px; background: #1f2a68 }
.top-concept .cont-1, .top-concept .cont-2 { margin-bottom: 11.25vw }
.top-concept .cont-1 .txt { position: relative; float: left; width: 39.5vw; padding: 14vw 0 0 6vw; font-size: 16px; letter-spacing: 0.24em }
.top-concept .cont-1 .vis { position: relative; float: right; width: 45.5vw; }
.top-concept .cont-2 .txt { position: relative; float: right; width: 39.5vw; padding: 12.5vw 6vw 0 0; font-size: 16px; letter-spacing: 0.24em  }
.top-concept .cont-2 .vis { position: relative; float: left; width: 45.5vw; }
.top-concept .cont-3 { position: relative; width: 72vw; margin: 0 auto; z-index: 10 }
.top-concept .cont-3 .txt { position: relative; position: absolute; left: 0; top: 0; font-size: 16px; letter-spacing: 0.24em  }
.top-concept .cont-3 .vis { position: relative; float: right; width: 55vw; padding: 10vw 0 0; }
.top-concept .lines { top: -6vw; z-index: 0 }

.top-collection {}
.top-collection .btit { position: relative; padding: 0 0 0 6vw; margin: 0 0 3vw; }
.top-collection .btit h2 { position: relative; font-size: 100px; line-height: 100px; height: 100px; font-family: AvenirNextLTPro-DemiIt, 'Noto Sans JP', Sans-Serif; }
.top-collection .btit h2 .lead { display: inline-block; font-size: 18px; font-weight: 500; letter-spacing: 0.24em; margin-left: 1.5em; vertical-align: middle }
.top-collection .btit h2 .ln { position: absolute; right: 0; bottom: 0.15em; display: block; width: 100%; height: 1px; background: #a5aac6 }
.top-collection .col { position: relative; padding: 0 6vw; margin: 0 0 4.5vw }
.top-collection .col .cir { width: 29.6vw }
.top-collection .col .btn-goto { position: absolute; right: -6vw; bottom: 4.5vw; width: 320px; }
.top-collection .img { position: relative }
.top-collection .img .ico-new { position: absolute; left: 0; top: 0; }
.btn-goto a { position: relative; display: block; padding: 12px 32px; font-size: 24px; font-family: AvenirNextLTPro-BoldIt, Sans-Serif; line-height: 1em; border-bottom: solid 4px #dd9d68 }
.btn-goto a .arw { display: inline-block; margin: 0 1em 0.5em 0; transition: all 0.2s; transform-origin: left }
.btn-goto a .ln { position: absolute; left: 0; bottom: -4px; width: 0; height: 4px; display: block; background: #a5aac6; transition: all 0.2s }
.btn-goto a:hover .arw { transform: scale(1.25) }
.btn-goto a:hover .ln { width: 100% }
.btn-goto a:link, .top-collection .col .btn-goto a:visited { color: #1f2a68; }
.btn-goto a:hover { color: #a5aac6 !important }
#top-col01 .cir { position: absolute; left: -3vw; top: 0; }
#top-col01 .cir h3 { position: absolute; right: 0; bottom: -20px; font-size: 60px; font-weight: 400; line-height: 1em; text-align: right; z-index: 10; }
#top-col01 .cir h3 span { display: block; font-size: 28px; line-height: 1.8em; letter-spacing: 0.24em; font-family: AvenirNextLTPro-MediumIt, Sans-Serif; padding: 0 0.2em; color: #a5aac6; z-index: 10 }
#top-col01 .col-body { position: relative; padding: 4vw 0 0 35%; margin-bottom: 1.8vw }
#top-col01 .col-body h3 { font-size: 32px; font-weight: 300; letter-spacing: 0.32em; margin-bottom: 3vw }
#top-col01 .col-body p { margin-bottom: 4.5vw }
#top-col01 .col-body p.cap { position: absolute; right: 0; bottom: 0; margin-bottom: 0; font-size: 12px }
#top-col01 .col-foot { position: relative; width: 65%; }
#top-col01 .col-foot p.cap { position: absolute; right: 0; bottom: 0; margin-bottom: 0; font-size: 12px }
p.cap span { font-weight: 500 }
#top-col01 #c02 .col-body { margin-bottom: 0 }
#top-col01 #c02 .col-foot { width: 65%; margin-left: 7.5% }
#top-col01 #c02 .col-foot p.cap { right: 7.5% }
#top-col02 .cir { position: absolute; right: -3vw; top: 0; }
#top-col02 .cir h3 { position: absolute; left: 0; bottom: -20px; font-size: 60px; font-weight: 400; line-height: 1em; text-align: left; z-index: 10; }
#top-col02 .cir h3 span { display: block; font-size: 28px; line-height: 1.8em; letter-spacing: 0.24em; font-family: AvenirNextLTPro-MediumIt, Sans-Serif; padding: 0 0.2em; color: #a5aac6; z-index: 10 }
#top-col02 .col-body { position: relative; padding: 4vw 35% 0 0; margin-bottom: 1.8vw }
#top-col02 .col-body h3 { font-size: 32px; font-weight: 300; letter-spacing: 0.32em; margin: 0 0 3vw 6vw }
#top-col02 .col-body p { margin: 0 0 4.5vw 6vw }
#top-col02 .col-body p.cap { position: absolute; left: 0; bottom: 0; margin-bottom: 0; font-size: 12px }
#top-col02 .col-foot { position: relative; width: 65%; margin-left: 20% }
#top-col02 .col-foot p.cap { position: absolute; left: 0; bottom: 0; margin-bottom: 0; font-size: 12px }

.lines.foot-ln { marign: 9vw 0 0; }
.lines.foot-ln span { left: 40%; }
.lines.foot-ln span:nth-child(1) { transform: rotate(-8.5deg); opacity: 0.66 }
.lines.foot-ln span:nth-child(2) { transform: rotate(-10deg); opacity: 1 }
.lines.foot-ln span:nth-child(3) { transform: rotate(-6deg); opacity: 0.33 }


/* footer */
#footer { position: relative; background: #fff; opacity: 0 }
#footer .foot-inner { position: relative; padding: 11.25vw 0 3vw; text-align: center; top: 6vw }
#footer .foot-inner p { margin-top: 1em }
#footer .foot-inner p.link { font-size: 18px; font-weight: 500 }
#footer .foot-inner .f-nav { margin: 4em 0 0 }
#footer .foot-inner .f-nav li { display: inline-block }
#footer .foot-inner .f-nav li:nth-child(3), #footer .foot-inner .f-nav li:nth-child(4) { display: none }
#footer .foot-inner .f-nav li a { padding: 0 2em; font-size: 20px; font-family: AvenirNextLTPro-MediumIt, Sans-Serif; }
#footer .foot-inner p.company { padding: 1em 0 0 }


/* Lower Contents */
.cont-tit { position: relative; padding: 0 0 4.5vw 6vw; }
.cont-tit h2 { position: relative; font-size: 100px; line-height: 100px; height: 100px; font-family: AvenirNextLTPro-DemiIt, 'Noto Sans JP', Sans-Serif; }

.collection { position: relative; margin-bottom: 11.5vw; }
.collection .col-inner { padding: 4.5vw 0 0; margin: 0 }
.collection .col-inner .col-vis { position: relative; float: left; width: 45vw; }
.collection .col-inner .col-vis span { position: absolute; right: 1vw; bottom: -0.5em; font-size: 120px; line-height: 1em; letter-spacing: 0.24em; color: #a5aac6; font-family: AvenirNextLTPro-LightIt, Sans-Serif; }
.collection .col-inner .col-txt { position: relative; float: right; width: 36vw; padding: 3vw 9vw 0 0 }
.collection .col-inner .col-txt h3 { font-size: 48px; font-weight: 500; line-height: 1em; margin-bottom: 2vw }
.collection .col-inner .col-txt h3 .en { font-size: 26px; color: #a5aac6; letter-spacing: 0.24em; font-family: AvenirNextLTPro-MediumIt, Sans-Serif; }
.collection .col-inner .col-txt p { font-size: 16px; font-weight: 500 }
.collection .col-wrap { position: relative; width: 50%; padding: 4.5vw 0 0; margin: 2.75vw auto 0; text-align: center }
.collection .col-wrap .ico-new { position: absolute; left: 0; top: 0; z-index: 10 }
.collection .col-wrap h3 { font-size: 20px; margin: 0 0 1em }
.collection .col-wrap p { padding: 0 10%; text-align: left }
.collection .col-wrap .btn-goto { padding: 0 25%; }
.collection .col-wrap .btn-goto a { padding: 12px 24px; font-size: 20px; }
.collection .col-wrap .slider { position: relative; text-align: center; overflow: visible }
.collection .col-wrap .slider li { text-align: center }
.collection .col-wrap .slider li img { margin: 0 auto !important }
.collection .col-inner.vis-r .col-vis { float: right; }
.collection .col-inner.vis-r .col-vis span { right: inherit; left: 3vw; }
.collection .col-inner.vis-r .col-txt { position: relative; float: left; width: 36vw; padding: 3vw 0 0 9vw }
.collection .lines { margin: 9vw 0 0; }
#run .lines span:nth-child(1) { transform: rotate(-11deg) }
#climb .col-inner .col-txt { padding: 0 0 0 9vw }

.gr { color: #a5aac6 }
img.gray {
opacity: 0.33;
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
}


/* 製品詳細ページ */
#item-detail { padding: 0.7vw 0 3vw }
#item-detail h3 { font-size: 40px; line-height: 40px; height: 40px; font-family: AvenirNextLTPro-DemiIt, 'Noto Sans JP', Sans-Serif; padding: 0 6.4vw }
#item-detail .item-list ul { padding: 8vw 26.4vw 0; margin: -5.6vw 0 0 }
#item-detail .item-list ul li { margin: 5.6vw 0 0 }
#item-detail .item-list ul li .item-pic {position: relative }
#item-detail .item-list h4 { font-size: 15px; font-weight: normal }
#item-detail .item-list h4 span { font-weight: 500; font-style: italic }
#item-detail .item-list h4 span.num { font-size: 20px; }
#item-detail .item-list .mrk { color: #fff; font-weight: 500; font-style: italic; line-height: 1; background: #d49f70; border-radius: 40px; padding: 8px 12px; display: inline-block; font-family: AvenirNextLTPro-DemiIt, 'Noto Sans JP', Sans-Serif; position: absolute; bottom: 1.5vw; left: 0; }
#item-detail .spec { text-align: center; padding: 5.8vw 0 }
#item-detail .spec span { font-weight: 500 }
#item-detail .spec .height { position: relative; padding: 0 0 0 10px; font-weight: normal !important }
#item-detail .spec .height_mrk { position: absolute; top: 5.5px; left: 0 }
#item-detail .feature-list ul { padding: 0 6.4vw; margin: -2.2vw 0 0 -2.9vw }
#item-detail .feature-list ul li { width: calc( 33.333% - 2.9vw); float: left; margin: 2.2vw 0 0 2.9vw }
#item-detail .feature-list ul li .pic { border-left: 1px solid #d2d4e2; box-sizing: border-box; margin: 0 0 20px }
#item-detail .feature-area { padding: 0 26.4vw 4vw; text-align: center; }
#item-detail .feature-area .pic { margin-top: 1em }
#item-detail .feature-area .CP-008_img01 { margin: -0.7vw 0 0; }
#item-detail .feature-area .CP-008_img01 img { width: 24vw; border-bottom: 1px solid #d2d4e2; padding: 0 0 0.8vw; margin: 0 0 0.5vw }
#item-detail .btn-goto { width: 320px; margin: 2.6vw auto 0 }
#item-detail .btn-goto a { text-align: center }


@media screen and (max-width: 1220px) {
    #header .globalNav li a { padding: 35px 15px; }
} 


@media screen and (max-width: 1080px) {
    #header .globalNav { display: none; }
}


@media screen and (max-width: 780px) {
	
    body { font-size: 13px; line-height: 1.6; letter-spacing: 0.04em; -webkit-text-size-adjust: none; overflow: hidden }
    h2, h3, h4, h5 { letter-spacing: 0.08em; 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 }
    .zm { transform: scale(1.24); }
    .txtl, .txtl-t { opacity: 0; display: inline-block }
    
    #to-main { position: relative; padding: 0 0 6vw; z-index: 0 }
    #to-main h1 { position: absolute; display: block; left: 0; bottom: 0; padding: 0 0 0 3vw; z-index: 10 }
    #to-main h1 img:nth-child(1) { display: none }
    #to-main h1 img:nth-child(2) { display: inline }
    #to-main .bot { position: absolute; left: 0; bottom: 6vw; z-index: 1 }
    #to-main .top-nav { position: absolute; left: 6vw; top: 33.33%; z-index: 1 }
    #to-main .top-nav .logo img { width: 140px }
    #to-main .top-nav ul { margin: 1em 0 0 }
    #to-main .top-nav ul li a { font-size: 12px; }
    #to-main .lines { top: -6vw; z-index: 9 }
    #to-main .lines span { left: 42% }
    
    .contents { position: relative; padding: 6vw 0 0; z-index: 1 }
    
    .top-concept { position: relative; margin: 0 0 18vw; }
    .top-concept .conts .slogan { position: absolute; left: 50%; top: calc(50% + 1.5em); margin: -25vw 0 0 -25vw; width: 50vw; height: 50vw; text-align: center; }
    .top-concept .conts .slogan h2 { display: inline-block; font-size: 14px; line-height: 2.5em; padding: 6vw 0; text-align: left; }
    .top-concept .cont-1 { margin-bottom: 0 }
    .top-concept .cont-2 { margin-bottom: 6vw }
    .top-concept .cont-1 .txt { position: relative; float: none; width: auto; padding: 14vw 6vw 6vw; font-size: 14px; }
    .top-concept .cont-1 .vis { position: relative; float: none; width: auto; }
    .top-concept .cont-2 .txt { position: relative; float: right; width: auto; padding: 6vw 6vw 0; font-size: 14px;  }
    .top-concept .cont-2 .vis { position: relative; float: left; width: auto; }
    .top-concept .cont-3 { position: relative; width: auto; margin: 0 auto; z-index: 10 }
    .top-concept .cont-3 .txt { position: relative; position: relative; left: inherit; top: inherit; font-size: 14px; padding: 6vw }
    .top-concept .cont-3 .vis { position: relative; float: none; width: auto; padding: 6vw 0 0; }
    .top-concept .lines { top: 9vw; z-index: 0 }
    
    .top-collection {}
    .top-collection .btit { position: relative; padding: 0 0 0 6vw; margin: 0 0 6vw; }
    .top-collection .btit h2 { position: relative; font-size: 50px; line-height: 50px; height: auto; }
    .top-collection .btit h2 .lead { display: inline-block; font-size: 14px; letter-spacing: 0.16em; margin-left: 0; vertical-align: middle }
    .top-collection .btit h2 .ln { position: absolute; right: 0; bottom: 0; display: block; width: 100%; height: 1px; background: #a5aac6 }
    .top-collection .col { position: relative; padding: 0 6vw; margin: 0 0 12vw }
    .top-collection .col .cir { width: 66.66vw; margin: 0 auto }
    .top-collection .col .btn-goto { position: relative; right: inherit; bottom: inherit; width: auto; }
    .top-collection .img .ico-new { left: -10px; width: 40px }
    #c03 .ph { margin-left: 10px }
    .btn-goto a { position: relative; display: block; padding: 6px 32px; font-size: 18px; width: 240px; margin-left: calc(100% - 240px) }

    #top-col01 .cir { position: relative; left: inherit; top: inherit; margin-bottom: 6vw }
    #top-col01 .cir h3 { position: absolute; right: 0; bottom: -30px; font-size: 40px; }
    #top-col01 .cir h3 span { display: block; font-size: 18px; line-height: 1.5em; letter-spacing: 0.24em; padding: 0 0.2em; }
    #top-col01 .col-body { position: relative; padding: 6vw 0; margin-bottom: 0 }
    #top-col01 .col-body h3 { font-size: 18px; letter-spacing: 0.24em; margin-bottom: 1em }
    #top-col01 .col-body p { margin-bottom: 4.5vw }
    #top-col01 .col-body p.cap { position: absolute; right: 0; bottom: 0; margin-bottom: 0; font-size: 10px }
    #top-col01 .col-foot { position: relative; width: 100%; padding: 6vw 0; margin-bottom: 6vw }
    #top-col01 .col-foot p.cap { position: absolute; right: 0; bottom: 0; margin-bottom: 0; font-size: 10px }
    #top-col01 #c02 .col-body { margin-bottom: 0 }
    #top-col01 #c02 .col-foot { width: 100%; margin-left: 0 }
    #top-col01 #c02 .col-foot p.cap { right: 7.5% }
    #top-col02 .cir { position: relative; right: inherit; top: inherit; margin-bottom: 6vw }
    #top-col02 .cir h3 { position: absolute; left: 0; bottom: -30px; font-size: 40px; }
    #top-col02 .cir h3 span { display: block; font-size: 18px; line-height: 1.5em; letter-spacing: 0.24em; padding: 0 0.2em; }
    #top-col02 .col-body { position: relative; padding: 6vw 0; margin-bottom: 0 }
    #top-col02 .col-body h3 { font-size: 18px; letter-spacing: 0.24em; margin: 0 0 1em }
    #top-col02 .col-body p { margin: 0 0 4.5vw }
    #top-col02 .col-body p.cap { position: absolute; left: 0; bottom: 0; margin-bottom: 0; font-size: 10px }
    #top-col02 .col-foot { position: relative; width: 100%; padding: 6vw 0; margin: 0 0 6vw }
    #top-col02 .col-foot p.cap { position: absolute; left: 0; bottom: 0; margin-bottom: 0; font-size: 10px }
    
    .lines.foot-ln { margin: 16vw 0 0; }
    
    /* footer */
    #footer .foot-inner { padding: 18vw 0 3vw; text-align: center }
    #footer .foot-inner .logo img { width: 160px }
    #footer .foot-inner p { font-size: 12px }
    #footer .foot-inner .f-nav { margin: 2em 0 0 }
    #footer .foot-inner .f-nav li { display: inline-block }
    #footer .foot-inner .f-nav li a { padding: 0 1em; font-size: 14px; }
    
    
    /* Lower Contents */
    .cont-tit { position: relative; padding: 0 0 6vw 6vw; }
    .cont-tit h2 { position: relative; font-size: 50px; line-height: 50px; height: 50px; }
    
    .collection { position: relative; margin-bottom: 18vw; }
    .collection .col-inner { padding: 4.5vw 0 0; margin: 0 }
    .collection .col-inner .col-vis { position: relative; float: none; width: auto; }
    .collection .col-inner .col-vis span { position: absolute; right: 1vw; bottom: -0.5em; font-size: 60px; line-height: 1em; }
    .collection .col-inner .col-txt { position: relative; float: right; width: auto; padding: 3vw 6vw 0 }
    .collection .col-inner .col-txt h3 { font-size: 32px; font-weight: 600; line-height: 1em; margin-bottom: 2vw }
    .collection .col-inner .col-txt h3 .en { font-size: 18px; color: #a5aac6; letter-spacing: 0.24em; font-family: AvenirNextLTPro-MediumIt, Sans-Serif; display: none }
    .collection .col-inner .col-txt p { font-size: 14px; font-weight: 500 }
    .collection .col-inner .col-txt p br { display: none }
    .collection .col-wrap { width: 90%; padding: 6vw 0 0; margin: 3vw auto 0; text-align: center }
    .collection .col-wrap .ico-new { width: 40px }
    .collection .col-wrap h3 { font-size: 20px; margin: 0 0 1em }
    .collection .col-wrap .slider { position: relative; text-align: center; overflow: visible }
    .collection .col-wrap .btn-goto { padding: 0 10%; }
    .collection .col-wrap .btn-goto a { padding: 6px 32px; font-size: 18px; width: auto; margin-left: 0 }
    .collection .col-inner.vis-r .col-vis { float: none; }
    .collection .col-inner.vis-r .col-vis span { right: 1vw; left: inherit; }
    .collection .col-inner.vis-r .col-txt { position: relative; float: none; width: auto; padding: 3vw 6vw 9vw }
    .collection .lines { margin: 12vw 0 0; }
    #run .lines span:nth-child(1) { transform: rotate(-11deg) }
    #climb .col-inner .col-txt { padding: 0 0 0 9vw }
	
	
	/* 製品詳細ページ */
	#item-detail { padding: 4vw 0 1vw }
	#item-detail h3 { font-size: 24px; padding: 0 6.4vw }
	#item-detail .item-list ul { padding: 8vw 5.8vw 0; margin: -10vw 0 0 }
	#item-detail .item-list ul li { margin: 10vw 0 0 }
    #item-detail .item-list h4 { font-size: 14px; font-weight: normal }
	#item-detail .item-list .mrk { font-size: 11px; padding: 6px 9px; position: absolute; bottom: 1vw; left: 0; }
	#item-detail .spec { padding: 10vw 0 }
	#item-detail .feature-list ul { margin: -6vw 0 0 0 }
	#item-detail .feature-list ul li { width: 100%; float: left; margin: 6vw 0 0 0 }
	#item-detail .feature-list ul li .pic { margin: 0 0 1.8vw }
	#item-detail .feature-area { padding: 0 5.8vw 6vw }
	#item-detail .feature-area .CP-008_img01 img { width: 50vw; padding: 0 0 2vw; margin: 0 0 1.6vw } 
    #item-detail .btn-goto { padding: 0 10%; width: auto; margin: 4vw auto 0 }
    #item-detail .btn-goto a { padding: 6px 32px; font-size: 18px; width: auto; margin-left: 0 }

}




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

}

/* margin-bottom
=========================================*/
.mb0 { margin-bottom:0 !important; }
.mb3 { margin-bottom:3px !important; }
.mb4 { margin-bottom:4px !important; }
.mb5 { margin-bottom:5px !important; }
.mb7 { margin-bottom:7px !important; }
.mb10 { margin-bottom:10px !important; }
.mb12 { margin-bottom:12px !important; }
.mb15 { margin-bottom:15px !important; }
.mb20 { margin-bottom:20px !important; }
.mb25 { margin-bottom:25px !important; }
.mb30 { margin-bottom:30px !important; }
.mb35 { margin-bottom:35px !important; }
.mb40 { margin-bottom:40px !important; }
.mb50 { margin-bottom:50px !important; }
.mb60 { margin-bottom:60px !important; }
.mb80 { margin-bottom:80px !important; }

.mb1em { margin-bottom: 1em !important; }


/* margin-top
=========================================*/
.mt0 { margin-top:0 !important; }
.mt3 { margin-top:3px !important; }
.mt4 { margin-top:4px !important; }
.mt5 { margin-top:5px !important; }
.mt7 { margin-top:7px !important; }
.mt10 { margin-top:10px !important; }
.mt12 { margin-top:12px !important; }
.mt15 { margin-top:15px !important; }
.mt20 { margin-top:20px !important; }
.mt25 { margin-top:25px !important; }
.mt30 { margin-top:30px !important; }
.mt35 { margin-top:35px !important; }
.mt40 { margin-top:40px !important; }
.mt50 { margin-top:50px !important; }
.mt60 { margin-top:60px !important; }

.ml30 { margin-left:30px !important; }

.mr5 { margin-right:5px !important; }
.mr10 { margin-right:10px !important; }
.mr20 { margin-right:20px !important; }
.mr40 { margin-right:40px !important; }
.mr80 { margin-right:80px !important; }



/* padding-top
=========================================*/
.pt0 { padding-top:0 !important; }
.pt3 { padding-top:3px !important; }
.pt4 { padding-top:4px !important; }
.pt5 { padding-top:5px !important; }
.pt7 { padding-top:7px !important; }
.pt10 { padding-top:10px !important; }
.pt12 { padding-top:12px !important; }
.pt15 { padding-top:15px !important; }
.pt20 { padding-top:20px !important; }
.pt25 { padding-top:25px !important; }
.pt30 { padding-top:30px !important; }
.pt35 { padding-top:35px !important; }
.pt40 { padding-top:40px !important; }
.pt50 { padding-top:50px !important; }
.pt60 { padding-top:60px !important; }


/**
 * ==============================================
 * Dot Typing
 * ==============================================
 */
.dot-typing {
  position: relative;
  left: -9999px;
  width: 5px;
  height: 5px;
  border-radius: 2.5px;
  background-color: #e9cbce;
  color: #e9cbce;
  box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  -webkit-animation: dot-typing 1s infinite linear;
  animation: dot-typing 1s infinite linear;
}

@-webkit-keyframes dot-typing {
  0% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  16.667% {
    box-shadow: 9986px -8px 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  33.333% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  50% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px -10px 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  66.667% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  83.333% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px -8px 0 0 #c7cad9;
  }
  100% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
}

@keyframes dot-typing {
  0% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  16.667% {
    box-shadow: 9986px -8px 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  33.333% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  50% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px -10px 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  66.667% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
  83.333% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px -8px 0 0 #c7cad9;
  }
  100% {
    box-shadow: 9986px 0 0 0 #1f2a68, 9999px 0 0 0 #8f94b3, 10012px 0 0 0 #c7cad9;
  }
}