/*
Theme Name: type-TN25
Author: TN
Version: 4.1, 2025.01
*/

@charset "UTF-8";
/*------------------------------------------------------------
	base
------------------------------------------------------------ */
* { box-sizing:border-box; }
html { font-size: 10px; webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; }
body { margin: 0; padding: 0; font: 15px/1.4 'Noto Sans JP', "Yu Gothic", YuGothic, "游ゴシック体", "Helvetica", "Lucida Grande", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", "Geneva", "Arial", "Verdana", sans-serif; height: 100%; background-color:#fff; color:#000; font-weight: 400;}
h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,figure{ margin: 0px; padding: 0px; }
ul { list-style-type: none; }
img { border: none; }
input,textarea,select { font-size: 1em; }
form { margin: 0px; }
table {	border-collapse:collapse; font-size: 100%; border-spacing: 0; width: 100%;}
/*link*/
a { border:0; text-decoration:none; color: inherit; transition: all .2s ease-in-out; }
a:hover { text-decoration: none; color:inherit; }
/*text*/
h1, h2, h3, h4, h5, h6 { text-align: left; line-height:1.5; line-break: strict; font-weight: 900;}
h1 { font-size: 2vw; }
h2 { font-size: 3vw; font-weight: 900; text-align: center;}
h3 { font-size: 2.4vw; }
h4 { font-size: 2.3vw; }
h5 { font-size: 1.9vw; }
h6 { font-size: 1.8vw; }
p { font-weight: 500; font-size: 16px; line-height: 1.6; letter-spacing: 1px;}
.caption { font-size : -webkit-calc(1em - 2px) ; font-size : calc(1em - 2px) ; }
.textC { text-align:center !important; }
.textL { text-align:left !important; }
.textR { text-align:right !important; }
.fsM { font-size:18px; }
.bpb0 { margin:0 !important; padding:0 !important; border:0 !important; }
.indt { text-indent: -1em; padding-left: 1em;}
.minc { font-family:游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; }
.itlc { font-style:italic; }
.obli { font-style:oblique; }
.dela { font-family: "Dela Gothic One", sans-serif;}

/*strong*/
strong { font-weight: 900; color: var(--point);}
b { color:#333; }
em, i { font-style: italic; }
.normal { font-weight:normal !important; }

/* IMG */
img { display:block; margin:0 auto; padding:0; border: 0; max-width:100%; }
img.center { display:block; margin:0 auto; }
img.left { float: left; margin: 0 15px 0 0; border: 0; }
img.right { float: right; margin: 0 0 0 15px; border: 0; }
a img { transition: all .2s ease-in-out; }
a:hover img { opacity:1; }
.w100 { width:100%; }
.wMax100 { max-width:100%; }
.cR { border-radius:10px; }
img.bd999 { border:1px solid #999; }
/* clearfx */
.cf:before, .cf:after { content: ""; display: table; }
.cf:after{ clear: both; }
.cf { zoom: 1; } /* For IE 6/7 */

/* LIST */
ul { margin-bottom: 0; list-style: none outside; }
ol { margin-bottom: 0; list-style: decimal; margin-left: 2.2em; }
ul.square, ul.circle { margin-left: 2em; }
ul.square { list-style: square outside; }
ul.circle { list-style: disc outside; }
ul ul.circle, ul ul.square { margin-top: 4px; margin-bottom: 5px; }

/* HR */
hr { border-width: 1px 0 0 0; border-style: solid; border-color: #bdbdbd; height: 1px; margin: 1.5em 0;}
hr.dot { border-width: 1px 0 0 0; border-style: dotted; border-color: #444; height: 1px; }
hr.dash { border-width: 1px 0 0 0; border-style: dashed; border-color: #444; height: 1px; }

/* Margin */
.btmMgn0 { margin-bottom:0 !important; }
.btmMgn-s { margin-bottom:5% !important; }
.btmMgn-m { margin-bottom:7% !important; }
.btmMgn-l { margin-bottom:10% !important; }
.btmMgn-fnt { margin-bottom:.6em !important; }

.topMgn0 { margin-top:0 !important; }
.topMgn-s { margin-top:5% !important; }
.topMgn-m { margin-top:7% !important; }
.topMgn-l { margin-top:10% !important; }

/* Padding */
.btmPad0 { padding-bottom:0 !important; }
.btmPad-s { padding-bottom:5% !important; }
.btmPad-m { padding-bottom:7% !important; }
.btmPad-l { padding-bottom:10% !important; }

.topPad0 { padding-top:0 !important; }
.topPad-s { padding-top:5% !important; }
.topPad-m { padding-top:7% !important; }
.topPad-l { padding-top:10% !important; }

.all0 { margin:0 !important; padding:0 !important; border:0 !important; background:none !important; }

i { font-size:calc(1em + 2px); }

@media(min-width:1300px) {
    h1 { font-size: 30px; }
    h2 { font-size: 48px; }
    h3 { font-size: 38px; }
    h4 { font-size: 30px; }
    h5 { font-size: 26px; }
    h6 { font-size: 22px; }
    p { font-size: 20px; }
}
@media(max-width:767px) {
    h1 { font-size: 2vw; }
    h2 { font-size: 6vw; }
    h3 { font-size: 4.8vw; }
    h4 { font-size: 4.4vw; }
    h5 { font-size: 4vw; }
    h6 { font-size: 3.6vw; }
    p { font-size: 1.4rem; }
    .caption { font-size : 1.2rem; }
    ul.square, ul.circle { margin-left: 1.5em; }
}
@media(max-width:320px) {
    p { font-size: 1.3rem; }
}

@media (min-width: 751px) {
    a[href^="tel:"] {
    pointer-events: none;
    cursor: default;
    }
}


/*------------------------------------------------------------
	COLOR
------------------------------------------------------------ */
:root {
  --red: #FCBDBD;
  --grn: #81FFD5;
  --grn2: #00744D;
  --org: #FF7E61;
  --pnk: #FF6363;
  --ylw: #fcf7bd;
  --blk: #000000;
}


/*------------------------------------------------------------
	header - nav
------------------------------------------------------------ */
body { background: url(images/common/body_bg.png) 0 0 repeat-y; background-size: 100%;}
header { position: relative; width:100%; padding:0; background: var(--red); top:0; z-index: 9999; box-shadow: 0 5px 0 var(--blk);}
.inner { width:96%; height:90px; margin: 0 auto; padding:0; display:flex; align-items:center; }
header h1, header p { position: relative; line-height:1; font-size:1em; text-align: center; display: flex; align-items: center; width: 14vw; max-width: 200px;}
header h1 a { display:block;}
header img { width: 100%; margin: 0 .8em 0 0;}

#mobile-head { margin: 0 auto 0 0;}
header nav ul { display:flex; align-items: center; justify-content: flex-end;}
header nav li { margin-left:1em; display: flex; align-items: center; text-decoration:none; font-size:1vw;}
header nav > ul > li > a { position:relative; display:block; text-decoration:none; font-size:1.15vw; text-align:center; line-height:1; padding: .4em 1em .6em; border: 2px solid var(--blk); background: #fff; box-shadow: 3px 3px 0px 0px var(--blk); border-radius: 100px; transition: .15s ease-in-out; font-weight: 700;}
header nav > ul > li:last-of-type > a { border-radius: 0; padding: 0 0 0 35%; background: url(images/common/btn_form_header.png) 0 0 no-repeat #fff; background-size: 35%; width: 11.5em;}
header nav > ul > li:last-of-type > a span { display: block; padding: .4em .7em .6em 0; }

/* FIXED */
header.fixed { position: fixed !important; top:0; bottom:inherit !important; width:100%; background: rgba(252,189,189,.8); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);}
header.fixed .inner { height:80px; }
header.fixed h1, header.fixed p { width: 14vw; max-width: 200px;}
header.fixed nav li { min-height: 80px;}

/*hover*/
header nav > ul > li > a:hover,
header nav > ul > li:last-of-type > a:hover { transform: translate(3px, 3px); box-shadow: 0 0 var(--blk); opacity: 1; background-color: var(--ylw);}


/* Toggle Button */
#nav-toggle { display: none; position: relative; right: 0; top: 0; width: 36px; height: 36px; cursor: pointer; z-index: 999; }
#nav-toggle div { position: relative; width:100%; margin:6px 0; }
#nav-toggle span { display: block; position: absolute; height: 3px; width: 100%; background: #d9d9d9; left: 0; transition: .35s ease-in-out; border-radius: 20px; }
#nav-toggle span:nth-child(1) { top: 0; }
#nav-toggle span:nth-child(2) { top: 12px; }
#nav-toggle span:nth-child(3) { top: 23px; }

@media(min-width:1740px) {
  header nav > ul > li > a { font-size:18px;}
  header nav > ul > li:last-child > a img { max-width: 260px;}

}
@media(max-width:1000px) {
  body { background: url(images/common/body_bg_sp.png) 0 110px repeat-y; background-size: 100%;}
  header { position: fixed;}
  header, .inner { width: 100%; padding: 0; height: 80px;}
  .inner { width:100%; margin:0 auto; padding:0;}
  header h1, header p { width: 50%; max-width: 200px; margin: 0 auto 0 0;}
  header.fixed h1, header.fixed p { width: 50%; }
  header h1 a, header p a { display: block;}
  header img { width: 100%; max-width: 100%;}
  header { margin:0; top:0; }
  #mobile-head { width: 92%; margin:0 auto; padding:0; position: relative; display: flex; align-items: center;}
  header nav {
  position: absolute;
  /* 開いてないときは画面外に配置 */
  top:85px;
  left:-100vw;
  background:#fff;
  width: 100%;
  height:calc(100vh - 85px);
  text-align: center;
  padding:0;
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  z-index: 998;
  overflow:scroll;
  -webkit-overflow-scrolling: touch;
  }
  header nav ul {
  list-style: none;
  position: static;
  right: 0;
  bottom: 0;
  font-size: 14px;
  align-items: flex-start;
  width:90%;
  margin: 5% auto 0;
  }

  header nav ul li,
  header.fixed nav li {
  position: relative;
  padding:0;
  min-height:auto;
  text-align:left;
  font-size:1.7rem;
  display:block;
  width:100%;
  }

  header nav > ul > li:not(:first-child) { margin-top: 1em;}
  
  header nav ul li a {
  width: 100%;
  display: block;
  padding: .8em 1.2em;
  text-align:left;
  font-size:4.5vw;
  background: none;
  font-weight: 800;
  text-align: center;
  }
  header nav > ul > li:last-child { margin-top: 8%;}
  header nav > ul > li:last-of-type > a { background-size: 30%; width: 100%;}
  header nav > ul > li:last-of-type > a span { padding: .6em 6vw .8em 0; font-size: 5.5vw;}



  
  #nav-toggle, #post-menu {
  display: block;
  }
  /* #nav-toggle 切り替えアニメーション */
  header.open #nav-toggle span:nth-child(1) {
  top: 11px;
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  transform: rotate(315deg);
  }
  header.open #nav-toggle span:nth-child(2) {
  width: 0;
  left: 50%;
  }
  header.open #nav-toggle span:nth-child(3) {
  top: 11px;
  -webkit-transform: rotate(-315deg);
  -moz-transform: rotate(-315deg);
  transform: rotate(-315deg);
  }
  /* nav スライドアニメーション */
  header.open nav {
  /* nav top + #mobile-head height */
  -moz-transform: translateX(100vw);
  -webkit-transform: translateX(100vw);
  transform: translateX(calc(100vw));
  }

  header nav ul { flex-direction:column;}
  header nav li { margin-left:0;}
  header nav a:before, header nav a:after, header nav a.on:before, header nav a.on:after { display:none; }

  header nav > ul > li > span,
  header nav ul li.drop li a { padding:0; width:100%; margin:0 auto .8em; line-height: 1;}
  header nav > ul > li > span { padding: .8em 0 0 1em;}
}
@media(max-width:320px) {
  nav ul li { padding-top:.6em; }
  header nav ul li a, header.fixed nav ul li a { padding: 1em 0 0; font-size:1.6rem; }
  header nav ul li a.onlySp, header.fixed nav ul li a.onlySp, header nav ul li a span, header.fixed nav ul li a span { font-size:1.4rem; }
}


/*------------------------------------------------------------
	BUTTON
------------------------------------------------------------ */
button, [type="button"], [type="reset"], [type="submit"] { background:none; border:0; }
button:active { color:#fff; }
.btns a img { box-shadow: 4px 4px 0px 0px var(--blk); transition: .15s ease-in-out;}
.btns a:hover img { transform: translate(4px, 4px); box-shadow: 0 0 var(--blk); opacity: 1;}
section > .btns { max-width: 90%; margin: 5% auto 0;}

@media(max-width:767px) {
  .btns { width: 80%; margin: 8% auto 0;}
  section > .btns { max-width: 90%; margin: 8% auto 0;}
}


/*------------------------------------------------------------
	COMMON
------------------------------------------------------------ */
main { display: block;}
section { position:relative; width:100%; margin: 10% auto 0; padding: 0; box-sizing: border-box; }
section:first-of-type { margin-top: 5%;}
.stdBx { position: relative; width:1040px; max-width:90%; margin:0 auto; }
.stdBx.min { width:800px; max-width:88%;}
dl { display: flex; align-items: center; justify-content: space-between;}
dt, dd { width: 48%;}
.stdBx > h2 { margin-bottom: .6em;}
.stdBx > h2,
.stdBx > h3,
.stdBx > h4,
.stdBx > h5,
.stdBx > h6 { text-align: center;}
section > .stdBx:not(:first-of-type) { margin-top: 4%;}

/* column */
.clmBox { position:relative; display:flex; flex-flow: row wrap; justify-content: space-between; box-sizing:border-box; }
.clmBox.normal { justify-content:flex-start; align-items:flex-start; }
.clmBox.cont-rev { justify-content:flex-end; align-items:flex-start; }
.clmBox.ali-rev { justify-content:flex-start; align-items:flex-end; }
.clmBox.all-rev { justify-content:flex-end; align-items:flex-end; }
.htmach { align-items:stretch; }
.clmBox li { display:block; padding:0; border:0; position:relative; }
.clmBox li.clmBox { display:flex; }
.clmBox img { width:100%; display:block; }
.clm2 li, .clm2 .clms { width:48%; }
.clm3 li, .clm3 .clms { width:30%;}
.clm4 li, .clm4 .clms { width:24%; }
.clm5 li, .clm5 .clms { width:19%; }
.clm2.box2 .clms { width:50%; }
.clms { box-sizing:border-box; position:relative; }
.clm3::after{content:"";display: block;width:30%;}
.clm4::before{content:"";display: block;width:24%;order:1;}
.clm4::after{content:"";display: block;width:24%;}
.clm5 .empty{width:19%; margin:0;}
.clms { margin-bottom:2%; }
.clm2 li img, .clm3 li img, .clm4 li img, .clm5 li img, .clms img { width:100%; height:auto; }
.imgauto img { width:auto !important; }
.clms a { width:100% !important; margin:0;}
.alignC { align-self:center; }
.alignC img { display:block; margin:auto; }
.clumn { display:flex !important; flex-direction:column; align-items: flex-start;}
.last-end-row { margin-right:auto; }
.last-end-clm { margin-top:auto; }

@media(max-width:767px) {
  main { margin-top: 80px;}
  section { margin-top: 14%; }
  .stdBx { width: 90%;}
  .stdBx.min { width: 90%;}
  section > .stdBx:not(:first-of-type) { margin-top: 10%;}
  .clm2 li, .clm2 .clms, .clm3 li, .clm3 .clms, .clm4 li, .clm4 .clms, .clm5 li, .clm5 .clms { width:47%; margin-bottom:0; }
  .clm5 .empty{ display:none;}
  .textC { padding:0 1em; }
  .disbox { display:block; }
  .disbox .clms { width:100%; }
  dl { flex-direction: column;}
  dt, dd { width: 100%;}
  dd { margin-top: 10%;}
}
@media(max-width:320px) {
  .stdBx.min { width:90%; }
}


/*------------------------------------------------------------
	DETAILE
------------------------------------------------------------ */
section > h2,
section > h3,
section > h4 { max-width: 92%; margin: 0 auto;}
section > h2 { text-align: center; margin: 0 auto 1.2em;}

section > h2 span { font-size: 34px;}
section > h2 span::after {
  content: "";
  position: absolute;
  bottom: -26px;
  left: 50%;
  margin-left: -14px;
  border: 14px solid transparent;
  border-top: 13px solid var(--main);
}
@media(max-width:767px) {
  section > h2 span { width: 28%; margin: 0 auto .3em; padding: .3em .5em .45em;font-size: 4.6vw; border-radius: 5px;}
  section > h2 span::after {
    bottom: -18px;
    margin-left: -10px;
    border: 10px solid transparent;
    border-top: 9px solid var(--main);
  }
}


/*------------------------------------------------------------
	TOP
------------------------------------------------------------ */
/* main */
#mainVl { width: 96%; margin: 0 auto; padding: 0;}
#mainVl h2 { width: 100%; max-width: 100%; margin: 0;}
#mainVl .btns { position: relative; top: -10vw; left: 16%; margin: 0;}
#mainVl h4 { position: relative; margin-bottom: 1em; right: -17%; font-size: 1.9vw;}

@media(max-width:767px) {
  #mainVl { width: 94%; margin: 0 auto; padding: 5% 0 0;}
  #mainVl h2 { margin: 0; width: 100%; max-width: 100%;}
  #mainVl h4 { right: inherit;  text-align: center; margin-top: 1em; font-size: 4.4vw;}
  #mainVl .btns { position: relative; top: inherit; left: inherit; margin: 8% auto 0;}
}

/* CHOOSE */
#choose dl { margin-top: 6%;}
#choose dl a { position: relative; padding: .8em 2em .8em 3.6em; display: flex; align-items: center; justify-content: flex-end; background: #fff; border: 3px solid var(--blk); box-shadow: 5px 5px 0px 0px var(--blk); text-align: right;}
#choose dl a img { padding: .8em 1em; border-radius: 10px; border: 3px solid var(--blk); box-shadow: 0px 4px 0px 0px var(--blk); position: absolute; left: -3px; width: 140px; height: 130px;}
#choose dl dt a img { background: var(--grn);}
#choose dl dd a img { background: var(--red); padding: 1em 1em;}
#choose dl a:hover img { opacity: 1;}
#choose dl dt a:hover { background: var(--grn);}
#choose dl dd a:hover { background: var(--red);}
#choose dl h5 { text-align: center; margin-bottom: 4vw;}

@media (min-width: 1300px) {
  #choose dl h5 { font-size: 24px; margin-bottom: .8em;}
}
@media(max-width:767px) {
  #choose dl a { padding: .8em 2em .8em 5em; justify-content: center;}
  #choose dl a img { padding: .8em 1em; border-radius: 6px; left: -3px; width: 20vw; height: 19vw;}
  #choose dl dd { }
  #choose dl dd a img { padding: 1em 1em;}
  #choose dl h5 { text-align: center; margin-bottom: 1em;}
}


/* CHOOSE-SHAPE */
#choose-shape li a { display: block; padding: 6% 7% 16%; border-radius: 10px; border: 3px solid var(--grn); box-shadow: 0px 6px 0px 0px var(--grn); background: #fff; position: relative;}
#choose-shape li a::after { content: ""; position: absolute; bottom: 6%; border-bottom: 5px solid var(--grn); width: 86%;}
#choose-shape li a::before { content: ""; position: absolute; bottom: 6%; border-right: 5px solid var(--grn); width: 100%; height: 16%; right: 6%;}
#choose-shape li:nth-child(n+4) { margin-top: 6%;}
#choose-shape li a h5 { text-align: center; color: var(--grn2);}
#choose-shape li a:hover { transform: translate(0, 6px); box-shadow: 0 0 var(--grn); opacity: 1;}

@media(max-width:767px) {
  #choose-shape h2 img { width: 70%;}
  #choose-shape li a::after,
  #choose-shape li a::before { bottom: 5%;}
  #choose-shape li:nth-child(n+3),
  #choose-shape li:nth-child(n+4) { margin-top: 8%;}
  #choose-shape li a h5 { font-size: 3.6vw;}
}


/* CHOOSE-PURPOSE */
#choose-purpose li a { display: block; padding: 6% 7% 16%; border-radius: 10px; border: 3px solid var(--org); box-shadow: 0px 6px 0px 0px var(--org); background: #fff; position: relative;}
#choose-purpose li a::after { content: ""; position: absolute; bottom: 6%; border-bottom: 5px solid var(--org); width: 86%;}
#choose-purpose li a::before { content: ""; position: absolute; bottom: 6%; border-right: 5px solid var(--org); width: 100%; height: 16%; right: 6%;}
#choose-purpose li:nth-child(n+4) { margin-top: 6%;}
#choose-purpose li a h5 { text-align: center; color: var(--org);}
#choose-purpose li a:hover { transform: translate(0, 6px); box-shadow: 0 0 var(--org); opacity: 1;}

@media(min-width:1250px) {
  #choose-shape li a h5:last-of-type,
  #choose-purpose li a h5:last-of-type { font-size: 22px;}
}

@media(max-width:767px) {
  #choose-purpose h2 img { width: 70%;}
  #choose-purpose li a::after,
  #choose-purpose li a::before { bottom: 5%;}
  #choose-purpose li:nth-child(n+3),
  #choose-purpose li:nth-child(n+4) { margin-top: 8%;}
  #choose-purpose li a h5 { font-size: 3.6vw;}
  #choose-purpose li a h5:last-of-type { font-size: 3vw;}
}


/* PRICE */
#price dl { margin: 3% 0;}
#price dl a { position: relative; padding: .8em 2em .8em 3.6em; display: flex; align-items: center; justify-content: flex-end; background: #fff; border: 3px solid var(--blk); box-shadow: 5px 5px 0px 0px var(--blk); text-align: right;}
#price dl a img { padding: .8em 1em; border-radius: 10px; border: 3px solid var(--blk); box-shadow: 0px 4px 0px 0px var(--blk); position: absolute; left: -3px;}
#price dl dt a img { background: var(--grn);}
#price dl dd a img { background: var(--red); padding: 1em 1em;}
#price dl a:hover img { opacity: 1;}
#price dl dt a:hover { background: var(--grn);}
#price dl dd a:hover { background: var(--red);}
#price h4 { text-align: center; }

@media(max-width:767px) {
  #price h4:first-of-type { font-size: 5.2vw;}
  #price dl { margin: 6% 0;}
  #price dl a { padding: .8em 2em .8em 5em; justify-content: center;}
  #price dl a img { padding: .8em 1em; border-radius: 6px; left: -3px; width: 20vw; height: 19vw;}
  #price dl dd { }
  #price dl dd a img { padding: 1em 1em;}
  #price dl h5 { text-align: center; margin-bottom: 1em;}
}


/* POINT3 */
#point3 h4, #point3 p { text-align: center;}
#point3 h4 { margin: .2em 0 1em;}
#point3 .stdBx:first-of-type { display: flex; align-items: center; justify-content: space-between; margin-top: 4%;}
#point3 .stdBx:first-of-type h4 { width: 30%; margin: 0;}
#point3 .stdBx h3 { text-align: center; margin: 1.2em auto 0; max-width: 160px;}
@media(max-width:767px) {
  #point3 .stdBx:first-of-type h4 { width: 33%;}
  #point3 .stdBx h3 { margin: 2em auto 0; max-width: 30%;}
}


/* WORKS */
#works .stdBx { border: 5px solid var(--blk); box-shadow: 10px 10px 0px 0px var(--blk); padding: 2% 4%;}
#works .stdBx:nth-of-type(even) { background-color: var(--grn);}
#works .stdBx:nth-of-type(odd) { background-color: var(--red);}
#works .stdBx:nth-child(n+2) { margin-top: 4%;}
#works .stdBx h3,
.contact-form h3 {
  margin-bottom: .8em;
  color: #fff;
  text-shadow:
    3px  3px 0 #000,
   -3px -3px 0 #000,
    3px -3px 0 #000,
   -3px  3px 0 #000,
    3px  0   0 #000,
   -3px  0   0 #000,
    0    3px 0 #000,
    0   -3px 0 #000;
}
#works .stdBx > h5 { font-weight: 600; width: 75%; margin-bottom: 1.5em; text-align: left;}
#works .stdBx img { position: absolute; top: 10%; right: -5%; z-index: 1; border-radius: 50%; background: #fff; border: 5px solid var(--blk); box-shadow: 5px 5px 0px 0px var(--blk); width: 28%; max-width: 310px;}
#works .stdBx li { width: 31.5%; background: #fff; padding: 1em; box-shadow: 5px 5px 0px 0px var(--blk);}
#works .stdBx li h5 { text-align: center;}
#works .stdBx li:nth-child(1) { box-shadow: 5px 5px 0px 0px var(--grn2) ;}
#works .stdBx li:nth-child(1) h5 { color: var(--grn2);}
#works .stdBx li:nth-child(2) { box-shadow: 5px 5px 0px 0px var(--org) ;}
#point3 .stdBx li:nth-child(2) h5 { color: var(--pnk);}

@media(max-width:767px) {
  #works h2 { width: 40%; margin-bottom: .6em;}
  #works .stdBx { padding: 8% 5%;}
  #works .stdBx:nth-child(n+2) { margin-top: 8%;}
  #works .stdBx > h5 { width: 100%; margin: 1.5em 0;}
  #works .stdBx img { position: relative; top: inherit; right: inherit; width: 55%;}
  #works .stdBx ul { flex-direction: column; align-items: center;}
  #works .stdBx li { width: 70%; padding: 1em;}
  #works .stdBx li:not(:first-of-type) { margin-top: 1em;}
}


/* FLOW */
#flow a:hover img { opacity: .8; }


/* FAQ */
#faq h5 { position: relative; margin-bottom: 41px; padding: .4em 1em .6em; background: var(--blk); color: #fff; display: inline-block; box-shadow: 5px 5px 0px 0px var(--blk);}
#faq h5 img,
#faq p img { position: absolute; top: -31px; left: 1%; z-index: 1;}
#faq p { position: relative; line-height: 1.3; }
#faq .stdBx > img { position: absolute; left: 36%; top: 30%; z-index: 2; width: 30%; max-width: 281px;}
#faq .qa01 p { background: url(images/top/ct08_a1_bg.png) 0 0 no-repeat; padding: 5% 7% 12% 4%; width: 40%; min-height: 170px; background-size: 100%;}
#faq .qa01 p img { top: -.8em; left: 3%;}
#faq .qa02 h5 { margin-left: 2em;}
#faq .qa02 p { background: url(images/top/ct08_a2_bg.png) 0 0 no-repeat; padding: 5% 7% 4% 6%; width: 43%; min-height: 160px; background-size: 100%;}
#faq .qa02 p img { top: -.2em; left: 3%;}
#faq .qa03 { position: absolute; top: 20%; right: 0; display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end;}
#faq .qa03 h5 { margin-bottom: 35px;}
#faq .qa03 p { padding: 3em 0 0 1em; width: 50%;}
#faq .qa03 p img { top: 0; left: 30;}
#faq h5::before {
  content: "";
  position: absolute;
  top: 90%;
  left: 10%;
  margin-left: -15px;
  border-top: 32px solid var(--blk);
  border-left: 14px solid transparent;
  border-right: 14px solid transparent;
  transform: rotate(30deg);
}
#faq .qa03 h5::before { left: 20%;}

@media(max-width:767px) {
  #faq h2 { width: 50%;}
  #faq h5 { text-align: center; padding: .4em 1.4em .6em; margin-bottom: 30px;}
  #faq h5 img,
  #faq p { font-size: 3.2vw;}
  #faq p img { top: -16px; left: 1%; width: 11vw;}
  #faq .stdBx > img { left: inherit; right: -4%; top: 23%; width: 32%;}
  #faq .qa01 h5 { width: 65%; margin-left: 35%;}
  #faq .qa01 p { background: url(images/top/ct08_a1_bg_sp.png) 0 0 no-repeat; margin-bottom: 14%; padding: 6% 7% 11% 5%; width: 85%; min-height: auto; background-size: 100%;}
  #faq .qa01 p img { top: -.8em; left: 3%;}
  #faq .qa02 h5 { margin-left: .5em;}
  #faq .qa02 p { background: url(images/top/ct08_a2_bg_sp.png) 0 0 no-repeat; padding: 5.5% 8% 7% 7%; width: 75%; margin: 0 0 15% 25%; min-height: inherit; background-size: 100%;}
  #faq .qa02 p img { top: -.9em; left: 8%;}
  #faq .qa03 { position: relative; top: inherit; right: inherit; display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end;}
  #faq .qa03 h5 { margin-bottom: 35px;}
  #faq .qa03 p { background: url(images/top/ct08_a3_bg_sp.png) 0 0 no-repeat; margin: 0 15% 0 0; padding: 5.5% 7% 11% 5%; width: 85%; background-size: 100%;}
  #faq .qa03 p img { top: -.8em; left: 3%;}
  #faq h5::before {
    content: "";
    position: absolute;
    top: 90%;
    left: 10%;
    margin-left: -15px;
    border-top: 32px solid var(--blk);
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    transform: rotate(30deg);
  }
  #faq .qa03 h5::before { left: 20%;}
}


/* CTA */
.cta .btns { display: flex; justify-content: center;}
.cta .btns img { margin: 0;}
@media(max-width:767px) {
  .cta h2 { font-size: 5.6vw;}
  .cta h4 { font-size: 3.6vw;}
}


/*------------------------------------------------------------
	PRODUCT
------------------------------------------------------------ */
section:first-of-type > h2 img { margin: 0;}
.prod-ct01 .stdBx { display: flex; flex-direction: column; align-items: center;}
.prod-ct01 .stdBx div { display: flex; align-items: flex-start; justify-content: center; margin-bottom: 2em;}
.prod-ct01 .stdBx div img { margin: 0 2%; max-width: 150px;}

.prod-ct02 h3 img { max-width: 250px;}
.prod-ct02 dl { flex-wrap: wrap; margin-top: 1.5em; border: 5px solid var(--grn); background: #fff; padding: 1% 4%;}
.prod-ct02 dt { width: 45%; padding: 1.4em;}
.prod-ct02 dd { width: 55%; padding: 1.4em;}
.prod-ct02 dt h5 { text-align: center;}
.prod-ct02 h6 { font-weight: 400;}
.prod-ct02 hr { width: 100%; margin: 0;}  
.trans h3 { margin-bottom: 1em;}
.trans a { width: 90%; max-width: 700px; margin: 4% auto 0; padding: 1em; display: block; border: 4px solid var(--blk); box-shadow: 5px 5px 0px 0px var(--blk); background: #fff; border-radius: 100px;}
.trans a:hover { transform: translate(5px, 5px); box-shadow: 0 0 var(--blk);}
.trans a img { max-width: 290px;}

@media(max-width:767px) {
  section:first-of-type > h2 img { margin: 0;}
  .prod-ct01 .stdBx { display: flex; flex-direction: column; align-items: center;}
  .prod-ct01 .stdBx div { margin-bottom: 2em;}
  .prod-ct01 .stdBx div img { margin: 0 2%; width: 22%;}

  .prod-ct02 h3 img { width: 50%;}
  .prod-ct02 dl { margin-top: 1em; padding: 4% 5% 5%;}
  .prod-ct02 dt,
  .prod-ct02 dd { width: 100%; padding: 0;}
  .prod-ct02 dd { margin-top: .5em;}
  .prod-ct02 h5 { font-size: 4.6vw;}
  .prod-ct02 h6 { text-align: center;}
  .prod-ct02 hr { width: 100%; margin: .4em 0 1.6em;}  
  .trans h3 { font-size: 5.6vw; margin-bottom: 1em;}
  .trans a { width: 80%; margin: 10% auto 0; padding: 1em; border: 3px solid var(--blk); box-shadow: 5px 5px 0px 0px var(--blk);}
  .trans a:hover { transform: translate(5px, 5px); box-shadow: 0 0 var(--blk);}
  .trans a img { width: 70%;}
}



/*------------------------------------------------------------
	FLOW
------------------------------------------------------------ */
.flow-main img { width: 100%;}
.flow-ct .stdBx h3 img { width: 100%; max-width: 785px; margin: 0 0 .5em;}
.flow-ct article { position: relative; }
.flow-ct article div { position: absolute;}
.flow-ct article div h4 { margin-bottom: .8em; line-height: 1.4;}
.flow-ct article div p { line-height: 1.6;}

.flow01 { background: url(images/flow/flow01_bg.png) 0 0 no-repeat; background-size: 100%; padding-top: calc(549/1010*100%);}
.flow01 div:nth-of-type(1) { width: 30%; top: 7%; left: 5%;}
.flow01 div:nth-of-type(2) { width: 45%; top: 7%; right: 5%;}
.flow01 div:nth-of-type(3) { width: 40%; right: 5%; bottom: 6%;}
.flow01 div:nth-of-type(2) p,
.flow01 div:nth-of-type(3) h4 { text-align: center;}

.flow02 { background: url(images/flow/flow02_bg.png) 0 0 no-repeat; background-size: 100%; padding-top: calc(518/1010*100%);}
.flow02 div:nth-of-type(1) { width: 90%; top: 7%; right: 5%;}
.flow02 div:nth-of-type(2) { width: 40%; top: 40%; left: 5%;}
.flow02 div:nth-of-type(3) { width: 35%; right: 5%; top: 62%;}
.flow02 div:nth-of-type(1) p,
.flow02 div:nth-of-type(1) h4 { text-align: right;}
.flow02 div:nth-of-type(1) p { width: 60%; margin: 0 0 0 40%;}
.flow02 div:nth-of-type(3) h4 { text-align: center; margin-bottom: .4em;}

.flow03 { background: url(images/flow/flow03_bg.png) 0 0 no-repeat; background-size: 100%; padding-top: calc(507/1007*100%);}
.flow03 div:nth-of-type(1) { width: 22%; top: 22%; left: 3%;}
.flow03 div:nth-of-type(2) { width: 27%; top: 12%; left: 37%;}
.flow03 div:nth-of-type(3) { width: 22%; top: 22%; right: 5%;}
.flow03 div:nth-of-type(2) p,
.flow03 div:nth-of-type(2) h4 { text-align: center;}
.flow03 div:nth-of-type(3) p,
.flow03 div:nth-of-type(3) h4 { text-align: right;}

.flow04 { background: url(images/flow/flow04_bg.png) 0 0 no-repeat; background-size: 100%; padding-top: calc(465/1010*100%);}
.flow04 div:nth-of-type(1) { width: 90%; top: 20%; left: 5%;}
.flow04 div:nth-of-type(2) { width: 50%; bottom: 11%; left: 5%;}
.flow04 div:nth-of-type(3) { width: 32%; bottom: 11%; right: 3%;}
.flow04 div p,
.flow04 div h4 { text-align: center;}

.flow05 { background: url(images/flow/flow05_bg.png) 0 0 no-repeat; background-size: 100%; padding-top: calc(480/1014*100%);}
.flow05 div:nth-of-type(1) { width: 43%; top: 25%; left: 5%;}
.flow05 div:nth-of-type(2) { width: 35%; top: 4%; right: 6%;}
.flow05 div:nth-of-type(3) { width: 35%; bottom: 7%; right: 5%;}
.flow05 div:nth-of-type(3) h4 { margin-bottom: .4em;}

.flow06 { background: url(images/flow/flow06_bg.png) 0 0 no-repeat; background-size: 100%; padding-top: calc(562/1010*100%);}
.flow06 div:nth-of-type(1) { width: 40%; top: 10%; left: 5%;}
.flow06 div:nth-of-type(2) { width: 42%; bottom: 12%; left: 10%;}
.flow06 div:nth-of-type(3) { width: 28%; top: 25%; right: 5%;}
.flow06 div:nth-of-type(2) h4 { text-align: right;}
.flow06 div:nth-of-type(3) h4 { margin-bottom: 2.5em;}

.flow07 { background: url(images/flow/flow07_bg.png) 0 0 no-repeat; background-size: 100%; padding-top: calc(521/1010*100%);}
.flow07 div:nth-of-type(1) { width: 60%; top: 9%; left: 16%;}
.flow07 div:nth-of-type(2) { width: 38%; bottom: 10%; left: 8%;}
.flow07 div:nth-of-type(3) { width: 32%; bottom: 10%; right: 5%;}
.flow07 div:nth-of-type(1) h4 { text-align: center;}
.flow07 div:nth-of-type(2) h4,
.flow07 div:nth-of-type(3) h4 { text-align: right;}


@media(min-width:1300px) {
  .flow-ct article div p { font-size: 19px;}

}
@media(max-width:767px) {
  .flow-main h2 { margin-bottom: 0;}
  .flow-ct .stdBx { margin-top: 20%!important;}
  .flow-ct .stdBx h3 img { margin: 0 0 .5em;}
  .flow-ct article div { position: relative; padding: 1em; width: 100%!important; border: 3px solid var(--blk); box-shadow: 5px 5px 0px 0px var(--blk);}
  .flow-ct article div h4 { text-align: center!important; line-height: 1.5; width: 100%!important; margin: 0 0 1em!important;}
  .flow-ct article div p { text-align: left!important; width: 100%!important; margin: 0!important;}

  .flow01,
  .flow02,
  .flow03,
  .flow04,
  .flow05,
  .flow06,
  .flow07 { padding: 0; background: none;}

  .flow01 div:nth-of-type(1),
  .flow02 div:nth-of-type(1),
  .flow03 div:nth-of-type(1),
  .flow04 div:nth-of-type(1),
  .flow05 div:nth-of-type(1),
  .flow06 div:nth-of-type(1),
  .flow07 div:nth-of-type(1) { background: var(--grn); top: inherit; left: inherit; right: inherit; bottom: inherit;}

  .flow01 div:nth-of-type(2),
  .flow02 div:nth-of-type(2),
  .flow03 div:nth-of-type(2),
  .flow04 div:nth-of-type(2),
  .flow05 div:nth-of-type(2),
  .flow06 div:nth-of-type(2),
  .flow07 div:nth-of-type(2) { background: #fff; margin-top: 5%; top: inherit; left: inherit; right: inherit; bottom: inherit;}

  .flow01 div:nth-of-type(3),
  .flow02 div:nth-of-type(3),
  .flow03 div:nth-of-type(3),
  .flow04 div:nth-of-type(3),
  .flow05 div:nth-of-type(3),
  .flow06 div:nth-of-type(3),
  .flow07 div:nth-of-type(3) { background: var(--red); margin-top: 5%; top: inherit; left: inherit; right: inherit; bottom: inherit;}



  
}


/*------------------------------------------------------------
	COMPANY
------------------------------------------------------------ */
.company-ct01 h2 { padding: 4% 0 5%;}
.company-ct01 h2 img { margin: 0 auto!important;}
.company-ct01 div { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;}
.company-ct01 div img { width: 31%;}
.company-ct01 div img:nth-of-type(n+4) { margin-top: 2%;}

.company-ct02 h5 { text-align: center; line-height: 1.7;}
.company-ct02 h5 img { display: inline-block; margin: 0 .2em 0 0; width: 135px;}

.company-ct03 h2 { margin-bottom: .6em;}
.company-ct03 h2 img { max-width: 203px;}
.company-ct03 .stdBx { padding: 1% 4% 4%; border-radius: 50px; border: 1px solid var(--blk); background: #fff;} 
.company-ct03 th,
.company-ct03 td { text-align: left; border-bottom: 1px solid var(--blk); padding: 1.8em .2em .5em; font-size: 2vw;} 
.company-ct03 th { width: 35%;}


@media(min-width:1300px) {
  .company-ct03 th,
  .company-ct03 td { font-size: 24px;} 
}
@media(max-width:767px) {
  .company-ct01 h2 { padding: 3% 0 8%; margin-bottom: 0;}
  .company-ct01 div img { width: 45%;}
  .company-ct01 div img:nth-of-type(n+3),
  .company-ct01 div img:nth-of-type(n+4) { margin-top: 5%;}

  .company-ct02 h5 img { width: 20%;}

  .company-ct03 h2 { margin-bottom: 1.2em;}
  .company-ct03 h2 img { width:50%;}
  .company-ct03 .stdBx { padding: 0 4% 6%; border-radius: 20px;} 


  .company-ct03 th,
  .company-ct03 td { font-size: 4.2vw; display: block; width: 100%; text-align: center;} 
  .company-ct03 th { border: 0; padding: 15% 0 0; font-size: 5vw;}
  .company-ct03 td { padding-top: 6%;}
  .company-ct03 tr:first-of-type th { padding-top: 10%;}
}


/*------------------------------------------------------------
	CONTACT
------------------------------------------------------------ */
.contact h2 { margin-bottom: .6em;}
.contact h2 img { margin: 0 auto!important;}
.contact h4 { text-align: center; width: 90%; margin: 0 auto;}

.contact-form .stdBx { border-radius: 10px; border: 1px solid var(--blk); background: #fff; overflow: hidden; padding-bottom: 5%;}
.contact-form h3 { text-align: center; padding: .4em 1em; background: var(--grn);}
.contact-form ul { padding: 3%;}
.contact-form li h6 { font-weight: 400; margin-bottom: .6em;}
.contact-form li:not(:first-child) { margin-top: 2em;}
.contact-form .submit { display: flex; align-items: flex-start; justify-content: center;}
.contact-form .submit input { width: 80%; max-width: 418px; margin: 5% auto 0;}


@media(max-width:767px) {
  .contact { padding-top: 5%;}
  .contact-form { margin-top: 10%;}
  .contact-form .stdBx { padding-bottom: 8%;}
}




/*------------------------------------------------------------
	footer
------------------------------------------------------------ */
footer { position:relative; width: 90%; margin: 15% auto 5%; padding:2.5% 4% 3%; border: 8px solid var(--blk); background: var(--red);}
footer h2 { text-align: center; color: #fff; margin-bottom: 1em; color: var(--blk);}
footer .footer_menu { display: flex; justify-content: space-between;}
footer .footer_menu > div { width: 30%;}
footer .footer_menu a { display: block; text-align: center; font-size: 2.2vw; margin-top: .8em; padding: .4em .6em .5em; background: #fff; font-weight: 900;}
footer .footer_menu > div:nth-of-type(1) a { color: var(--grn2); box-shadow: 5px 5px 0px 0px var(--grn);}
footer .footer_menu > div:nth-of-type(2) a { color: var(--org); box-shadow: 5px 5px 0px 0px var(--pnk);}
footer .footer_menu > div:nth-of-type(1) a:hover { transform: translate(5px, 5px); box-shadow: 0 0 var(--grn);}
footer .footer_menu > div:nth-of-type(2) a:hover { transform: translate(5px, 5px); box-shadow: 0 0 var(--pnk);}
footer .footer_menu > div h3 { max-width: 255px; margin: 0 auto;}
footer .footer_menu > div:nth-of-type(3) { display: flex; flex-direction: column;}
footer .footer_menu > div:nth-of-type(3) a { font-size: 2.5vw; border: 4px solid var(--blk); box-shadow: 5px 5px 0px 0px var(--blk); background: #fff; border-radius: 100px;}
footer .footer_menu > div:nth-of-type(3) a:hover { transform: translate(5px, 5px); box-shadow: 0 0 var(--blk);}
footer .footer_menu > div:nth-of-type(3) a:last-of-type { border-radius: 0; margin: auto 0 0; padding: 0 0 0 35%; background: url(images/common/btn_form_header.png) 0 0 no-repeat #fff; background-size: 36%; width: 100%; font-size: 2vw;}
footer .footer_menu > div:nth-of-type(3) a:last-of-type span { display: block; padding: .4em .7em .6em 0; }
footer .footer_menu > div a:hover,
footer .footer_menu > div:nth-of-type(3) a:last-of-type:hover { background-color: var(--ylw);}
footer dl { justify-content: center; margin-top: 4%;}
footer dl a { display: block; border: 4px solid var(--blk); box-shadow: 5px 5px 0px 0px var(--blk); background: #fff; margin-top: 1em;}
footer dl dt { max-width: 255px; margin-right: 10%;}
footer dl dt a { padding: .5em;}
footer dl dd { display: flex; flex-direction: column; width: auto;}
footer dl dd h5 { display: flex; justify-content: flex-start; font-size: 1.6vw;}
footer dl dd a { border-radius: 100px; display: flex; align-items: center; justify-content: flex-start; padding: .3em 0 .4em 2em;}
footer dl a:hover { transform: translate(5px, 5px); box-shadow: 0 0 var(--blk);}
footer dl a:hover img { opacity: 1;}
footer dl dd a img { width: 16%; margin: 0 1em 0 0;}

.pagetop a { position:fixed; right:2%; bottom:4%!important; background: #fff; padding:0; z-index:9900; border: 4px solid var(--blk); width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; color: var(--blk);}
.pagetop a i { margin-top: -.2em;}
.pagetop a:hover { height: 50px; color: var(--blk); background: #fff;}

@media(min-width:1200px) {
  footer .footer_menu > div a { font-size: 24px;}
  footer .footer_menu > div:nth-of-type(3) a { font-size: 32px; border: 5px solid var(--blk);}
  footer .footer_menu > div:nth-of-type(3) a:last-of-type { font-size: 30px;}
  footer dl dd h5 { font-size: 26px;}
}
@media(max-width:767px) {
  footer { width: 100%; margin: 20% auto 0; padding: 5% 6% 6%; border: 5px solid var(--blk);}
  footer h2 { font-size: 5vw; margin-bottom: 1em;}
  footer .footer_menu { flex-wrap: wrap;}
  footer .footer_menu > div { width: 46%;}
  footer .footer_menu a { font-size: 3.4vw; margin-top: 1.5em; padding: .8em .4em .9em;}
  footer .footer_menu > div:nth-of-type(3) { align-items: center;width: 100%;}
  footer .footer_menu > div:nth-of-type(3) a { display: block; width: 66%; font-size: 4.4vw; border: 3px solid var(--blk);}
  footer .footer_menu > div:nth-of-type(3) a:last-of-type { margin-top: 12%; padding: 0 0 0 35%; background-size: 36%; width: 84%; font-size: 5vw;}
  footer .footer_menu > div:nth-of-type(3) a:last-of-type span { padding: .5em 1em .7em 0; }

  footer dl { justify-content: center; margin-top: 12%;}
  footer dl dt { width: 70%; max-width: 255px; margin-right: 0;}
  footer dl dt h5 img { width: 65%;}
  footer dl dt a { border: 3px solid var(--blk); margin-top: .6em; padding: .5em;}
  footer dl dd { align-items: center;}
  footer dl dd h5 { font-size: 3vw; margin-top: .5em;}
  footer dl dd a { justify-content: center; padding: .6em 1em .7em;}
  footer dl dd a img { width: 12%; margin: 0 1em 0 0; display: inline-block;}
  footer dl dd h5:last-of-type a img { width: 15%;}
  .pagetop { display: none!important;}
}


/*------------------------------------------------------------
	form
------------------------------------------------------------ */
form { font-size:20px; line-height:1.2; font-weight:normal; color:#000; }
form input { margin:0 auto; }
form label { margin:0; font-size:16px; line-height:1.2; font-weight:normal; color:#000; }
input[type="radio"], input[type="checkbox"] { margin:0 5px 0 0; }
span label { margin-right:15px; }
textarea { width:100% !important; border-color:#ccc; }
table.form { position:relative; width:100%; margin:0 auto; }
table.form th { width:35%; }
table.form td { padding:0; }

input[type="text"], input[type="email"], textarea { width:99%; box-sizing: border-box; border:1px solid #ccc;-webkit-appearance: none; padding:.6em .8em .7em; border-radius: 6px; line-height:1; background: #EAFFF8;}

input[type="submit"] { display: inherit; margin:20px auto 0; border:0; box-shadow: none; transition: none; text-decoration:none !important; cursor:pointer; transition: all .2s ease-in-out; }
form .chec { display:block; text-align:center; cursor:pointer; }

@media(max-width:767px) {
  form { font-size:16px; line-height:1.2; }
  form input { width:96%; margin:0 auto; border-color:#bbb; }
  form label { font-size:1.5rem; line-height:1.2; }
  input[type="radio"] { margin:0 .4em 0 0; }
  input[type="checkbox"] { margin:0; width:auto; }
  span label { margin-right:0; }
  input[type="text"], input[type="email"], textarea { font-size:16px; }

  table.form { width:100%; }
  table.form th, table.form td { border:0; font-size:1.6rem; line-height:1.2; display:block; width:100%; text-align:center; }
  table.form td { margin:3% 0 10%;}
}


/*------------------------------------------------------------
	320px
------------------------------------------------------------ */
@media(max-width:320px) {
  .col2 li, .col2 li:nth-child(2n) { position:relative; width:94%; }
  .blogs li p.cate { font-size:1.1rem; padding:.3em .6em; }
  .small-container { padding-bottom: 200%; /* 高さ */ }
  input[type="submit"], .inqBtn { font-size:1.6rem; }
  img.logo { float:none !important; margin:0 auto 0; display:block; }
  p.footInfo { padding:0; }
}


/*------------------------------------------------------------
	others
------------------------------------------------------------ */
@media(min-width:768px) {
	.onlySp { display:none !important; }
}
@media(max-width:767px) {
	.onlyPc { display:none !important; }
}
@media(max-width:411px) {
	.small-container { padding-bottom: 172%; /* 高さ */ }
}
@media (min-width: 751px) {
    a[href^="tel:"] {
    pointer-events: none;
    cursor: default;
    }
}