﻿@charset "utf-8";
/* root */
:root{
  --regular:400;
  --bold:600;
  --xbold:700;
  --xsmall:10px;
  --small:12px;
  --medium:15px;
  --large:18px;
  --xlarge:24px;
  --border:#ddd;
  --lightgray:#bbb;
  --gray:#888;
  --black:#222;
  --white:#fff;
  --opacity:0.75;
  --black-610:#232423;
  --pewter-636:#424a53;
  --white-e600:#dfdfdd;
  --charcoal-608:#3b3d3c;
  --royal-638:#2d3073;
  --yellow-e605:#e1e059;
  --silver-610:#9da59d;
  --navy-640:#232531;
  --sky-e634:#586eb0;
  --brown-612:#322c25;
  --orange-647:#db6831;
  --saffron-e694:#f2b24f;
  --pink-613b:#c1929e;
  --red-649:#9d3333;
  --fluorescentgreen-e6k1:#9ad768;
  --olive-626:#333a2b;
  --wine-651:#321d1f;
  --fluorescentorange-e6k3:#ee7c3a;
  --powder-635:#2a3880;
  --gray-666:#595a54;
  --ice-e607:#96aac0;
  --purple-6403:#2f236f;
  --ptgreen-6139:#244f3f;
  --pattern-1:url(../../assets/images/pattern/1.png) 0 0 / 70px repeat;
  --pattern-2:url(../../assets/images/pattern/2.png) 0 0 / 50px repeat;
  --pattern-3:url(../../assets/images/pattern/3.png) 0 0 / 40px repeat;
  --pattern-4:url(../../assets/images/pattern/4.png) 0 0 / 70px repeat;
  --pattern-5:url(../../assets/images/pattern/5.png) 0 0 / 50px repeat;
  --pattern-6:url(../../assets/images/pattern/6.png) 0 0 / 50px repeat;
  --pattern-7:url(../../assets/images/pattern/7.png) 0 0 / 50px repeat;
  --pattern-8:url(../../assets/images/pattern/8.png) 0 0 / 70px repeat;
  --pattern-9:url(../../assets/images/pattern/9.png) 0 0 / 70px repeat;
  --pattern-10:url(../../assets/images/pattern/10.png) 0 0 / 70px repeat;
}
/* transparent */
.transparent{fill:none;}
/* logo */
.logo{fill:var(--white);}
/* linecolor-1 */
.linecolor-1{fill:#444;}
.women-frontzip .linecolor-1,
a[href*="women-frontzip"] .linecolor-1{fill:url(#pattern-5);}
.women-chestzip .linecolor-1,
a[href*="women-chestzip"] .linecolor-1{fill:url(#pattern-10);}
.women-longjohn .linecolor-1,
a[href*="women-longjohn"] .linecolor-1{fill:url(#pattern-7);}
.women-shortjohn .linecolor-1,
a[href*="women-shortjohn"] .linecolor-1{fill:var(--powder-635);}
.men-chestzip .linecolor-1,
a[href*="/men-chestzip"] .linecolor-1{fill:var(--gray-666);}
/* linecolor-2 */
.linecolor-2{fill:#888;}
.women-frontzip .linecolor-2,
a[href*="women-frontzip"] .linecolor-2{fill:var(--ice-e607);}
.women-chestzip .linecolor-2,
a[href*="women-chestzip"] .linecolor-2{fill:var(--white-e600);}
.women-shortjohn .linecolor-2,
a[href*="women-shortjohn"] .linecolor-2{fill:var(--pink-613b);}
/* basecolor */
.basecolor{fill:#666;}
.women-frontzip .basecolor,
a[href*="women-frontzip"] .basecolor{fill:var(--black-610);}
.women-chestzip .basecolor,
a[href*="women-chestzip"] .basecolor{fill:var(--silver-610);}
.women-longjohn .basecolor,
a[href*="women-longjohn"] .basecolor{fill:var(--gray-666);}
.women-shortjohn .basecolor,
a[href*="women-shortjohn"] .basecolor{fill:url(#pattern-4);}
.men-chestzip .basecolor,
a[href*="/men-chestzip"] .basecolor{fill:var(--black-610);}
/* pad */
.pad{fill:#222;stroke:#000;stroke-miterlimit:10;}
/* outline */
.outline{fill:none;stroke:#ddd;stroke-miterlimit:10;stroke-width:0.5px;}
/* stitch */
.stitch{fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:0.5px;}
.women-frontzip .stitch,
a[href*="women-frontzip"] .stitch{stroke:var(--sky-e634);}
.women-chestzip .stitch,
a[href*="women-chestzip"] .stitch{stroke:var(--gray-666);}
.women-longjohn .stitch,
a[href*="women-longjohn"] .stitch{stroke:var(--white-e600);}
.women-shortjohn .stitch,
a[href*="women-shortjohn"] .stitch{stroke:var(--sky-e634);}
.men-chestzip .stitch,
a[href*="/men-chestzip"] .stitch{stroke:var(--silver-610);}
/* basic */
.black-610{background:var(--black-610);}
.pewter-636{background:var(--pewter-636);}
.white-e600{background:var(--white-e600);}
.charcoal-608{background:var(--charcoal-608);}
.royal-638{background:var(--royal-638);}
.yellow-e605{background:var(--yellow-e605);}
.silver-610{background:var(--silver-610);}
.navy-640{background:var(--navy-640);}
.sky-e634{background:var(--sky-e634);}
.brown-612{background:var(--brown-612);}
.orange-647{background:var(--orange-647);}
.saffron-e694{background:var(--saffron-e694);}
.pink-613b{background:var(--pink-613b);}
.red-649{background:var(--red-649);}
.fluorescentgreen-e6k1{background:var(--fluorescentgreen-e6k1);}
.olive-626{background:var(--olive-626);}
.wine-651{background:var(--wine-651);}
.fluorescentorange-e6k3{background:var(--fluorescentorange-e6k3);}
.powder-635{background:var(--powder-635);}
.gray-666{background:var(--gray-666);}
.ice-e607{background:var(--ice-e607);}
.purple-6403{background:var(--purple-6403);}
.ptgreen-6139{background:var(--ptgreen-6139);}
/* pattern */
.pattern-1{background:var(--pattern-1);}
.pattern-2{background:var(--pattern-2);}
.pattern-3{background:var(--pattern-3);}
.pattern-4{background:var(--pattern-4);}
.pattern-5{background:var(--pattern-5);}
.pattern-6{background:var(--pattern-6);}
.pattern-7{background:var(--pattern-7);}
.pattern-8{background:var(--pattern-8);}
.pattern-9{background:var(--pattern-9);}
.pattern-10{background:var(--pattern-10)}
/* body */
body{margin:0;padding:0;background:var(--white);box-sizing:border-box;font-size:var(--medium);color:var(--black);font-weight:var(--regular);font-family:"Noto Sans JP", sans-serif;letter-spacing:0.05em;overflow-x:hidden;}
/* default */
header,nav,footer,main,section,aside,article,hgroup,div,span,em,i,b,strong,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,th,td,form,input,select,textarea,hr,button,a,figure,picture{margin:0;padding:0;box-sizing:border-box;}
figure,picture{display:block;}
th,b,strong,h1,h2,h3,h4,h5,h6{font-weight:var(--bold);}
input,select,textarea,button{font-weight:var(--regular);}
input,select,textarea,button{display:block;-webkit-appearance:none;}
ul,ol{list-style:none;}
i,em{font-style:normal;}
svg, img, video{display:block;border:0;outline:0;width:100%;}
a{color:var(--black);}
a:hover{text-decoration:none;}
a img:hover{opacity:var(--opacity);}
sup{position:relative;top:-0.1em;vertical-align:top;}
p{font-size:var(--medium);line-height:2em;}
p small{display:block;font-size:var(--xsmall);line-height:1.5em;color:var(--gray)}
p + p{margin-top:1em;}
hr{margin:20px 0;padding:0;border:0;height:0;}
table{margin:0 auto;border-collapse:collapse;border-spacing:0;width:auto;}
table tr > *{padding:5px 0;border:0;}
table th{padding-right:15px;text-align:left;vertical-align:top;white-space:nowrap;}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"]{;}
input[type="radio"], input[type="checkbox"]{}
select{}
textarea{}
input[type="submit"]{}
input[type="submit"]:disabled{}
button{border:0;}
/* slick */
.slick-dotted.slick-slider{margin-bottom:90px;}
.slick-dots{position:relative;bottom:-30px;line-height:0;}
.slick-dots li{display:inline-block;margin:0 5px;border:0;width:auto;height:auto;}
.slick-dots li button{background:var(--lightgray);border:0;border-radius:50%;width:10px;height:10px;cursor:pointer;}
.slick-dots li.slick-active button{background:var(--black);}
.slick-dots li button:before{display:none;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
}
/* header */
header{padding:30px 0;}
header img{margin:0 auto;width:150px;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
}
/* main */
main{margin:0 auto 30px;padding:0 30px;}
main figure{margin:0 auto 30px;}
main h4{font-size:var(--medium);line-height:1em;font-family:Oswald;font-weight:var(--regular);}
main h4 em{display:inline-block;margin:0 0 0 1em;font-size:var(--xsmall);line-height:1em;color:var(--gray);}
main p{margin:30px 0 0;text-align:center;}
main p small{margin:15px 0 0;}
main ul.models{display:flex;flex-wrap:wrap;gap:10px;}
main ul.colors{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;}
main h4 + ul.colors{margin-top:15px;}
main ul.colors:last-child{padding:0 0 10px;}
main ul.colors + ul{margin-top:10px;}
main ul.colors li{border:1px solid var(--border);width:20px;height:20px;cursor:pointer;font-size:0;line-height:0;}
main ul.colors li[class*="pattern"]{width:30px;height:30px;}
main ul.colors li.selected{border-color:var(--gray);}
main ul.colors li:not(.disabled):hover{opacity:var(--opacity);}
main ul.colors li.disabled{position:relative;overflow:hidden;cursor:default;}
main ul.colors li.disabled:before,
main ul.colors li.disabled:after{position:absolute;display:block;content:""; top:50%;left:50%;background:var(--border);width:1px;height:30px;}
main ul.colors li.disabled:before{transform:translate(-50%,-50%) rotate(45deg);}
main ul.colors li.disabled:after{transform:translate(-50%,-50%) rotate(-45deg);}
dl.tabs{display:flex;gap:10px;flex-wrap:wrap;}
dl.tabs dt{width:calc(25% - 7.5px);cursor:pointer;}
dl.tabs dt img{margin:0 auto;width:60px;}
dl.tabs dt span{display:block;margin:10px auto 0;font-size:var(--small);line-height:1.25em;text-align:center;}
dl.tabs dt.active img{opacity:0.5;}
dl.tabs dd{display:none;margin:15px auto 0;width:100%;}
@media screen and (min-width:768px){
  main section{margin:0 auto;max-width:720px;}
  main figure{display:flex;max-width:480px;}
  main ul.models li{width:calc(25% - 7.5px);}
}
@media screen and (max-width:767px){
  main figure{max-width:360px;}
  main p small{padding:0 0 0 1em;text-indent:-1em;text-align:left;}
  main ul.models li{width:calc(50% - 5px);}
}
/* aside */
aside{padding:60px 30px;}
aside p{text-align:center;}
aside p img{margin:0 auto;max-width:360px;}
aside ul{display:flex;margin:30px auto 0;gap:10px;flex-wrap:wrap;max-width:380px;justify-content:center;}
aside ul li img{margin:0 !important;width:120px;}
@media screen and (min-width:768px){
  aside{margin:0 auto;max-width:720px;}
}
@media screen and (max-width:767px){
}
/* footer */
footer{padding:30px 0;}
footer p{font-size:var(--medium);font-family:Oswald;text-align:center;}
@media screen and (min-width:768px){
}
@media screen and (max-width:767px){
}
