@charset "UTF-8";
/* =======================================

	CommonElements

======================================= */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
/*	outline: 0;*/
}
html {scroll-behavior: smooth;}

/*-----------------------------------------
  基本
-----------------------------------------*/
* { margin: 0; padding: 0; }
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
.img_c { display: block; margin-left: auto; margin-right: auto; max-width: 100%; }
a:hover img {
  opacity:0.7;
  filter:alpha(opacity=70);
  -ms-filter: “alpha( opacity=70 )”;
}
img{
  max-width: 100%;
  height: auto;
  width /***/:auto;
}
ul li {list-style:none; }
body, html, main {
    /* important */
    height: 100%;
}
body {
  font-size: 18px;font-size: 1.0em;
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
  color: #333;
  line-height: 1.9;
}
a {color:#493b1a; word-wrap:break-word; text-decoration: none;}
a:hover {color:#635024;}
@media screen and (max-width: 767px)
{body {	font-size: 1.1em;}}

::selection
{    background: #fff7b8;}

/* for Firefox */
::-moz-selection
{    background: #fff7b8;}

/*-----------------------------------------
  共通で使える
-----------------------------------------*/
.container {
	width: 100%;
	text-align: center;
	position: relative;
}
#wrapper {
  width: 100%;
  position: relative;
  height: auto;
}
.mincho {font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; font-weight: 500;}
section{text-align: left;}
.w1000 {  max-width: 1000px; margin: 0 auto; position: relative;}
.w1400 {  max-width: 1400px; margin: 0 auto; position: relative;}
.text {  text-align: left; }
.txtblue {color:#1CC0E6; font-weight: bold;}
@media screen and (max-width: 1399px){
	.w1400 { width: 95%; margin: 0 auto;padding: 0;}
}
@media screen and (max-width: 1199px){
	.w1000 { width: 95%; margin: 0 auto;padding: 0;}
}

@media screen and (max-width: 767px) {
    .br-pc { display:none; }
	
}
@media screen and (min-width: 768px) {
    .br-sp { display:none; }
}

/*-----------------------------------------
  ヘッダー
-----------------------------------------*/

@media screen and (min-width: 768px){
	.header {  display: none;}
	.header_pc {width:100%; height: 150px; background-color: rgba(255,255,255,0.8); display: block;position: absolute;z-index: 80; }
	.header_kaso {width:100%; height: 150px; background-color: #fff; display: block; box-shadow: 1px 1px 4px 2px rgb(0 0 0 / 30%);z-index: 80; }
	.pclogo{width:30%; float: left;}
	.headbtn {float:right;display: flex; margin-top:10px;}
	
/* pcグローバルナビ */	
.nav_pc {width:100%; display: flex; justify-content: end; align-items: center;  padding: 0; }

.header_pc .nav_pc nav ul,.header_kaso .nav_pc nav ul{ float: right; text-align: right; margin-left: 12%;}
.header_pc .nav_pc nav ul,.header_kaso .nav_pc nav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.header_pc .nav_pc nav ul li a,.header_kaso .nav_pc nav ul li a {
  display: block;
  padding: 40px 0 5px;
  font-weight: bold;
  position: relative;
  width: 115px;
  text-align: center;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  font-size: 13px;
  font-size: 0.85rem;
	line-height: 1.2em;
	color: #000;
	text-decoration: none;
}
.header_pc .nav_pc nav ul li a:hover, .header_kaso .nav_pc nav ul li a:hover {
  text-decoration: none;
  -ms-filter: "alpha( opacity=$number*100 )";
  filter: alpha(opacity=100);
  opacity: 1;
  color: #ff9907;
}

}
.snsicon {font-size: 0.8em; display: flex; gap:10px; align-items: center; margin-right: 10px;font-weight: 600;}
.snsicon img {width:42px; }
.header_tel { background-color: #ffeb0f; font-size: 1.6em; font-weight: bold; color: #000; padding: 0 15px 0 15px; margin-right: 20px;border-radius: 6px;}
	.header_tel::before {  content: url(../img/common/headericon_tel.png);  display: inline-block; position:relative; top: 6px;  transform: scale(1.0);}
	.header_btn { margin: 12px 0 0;}
	.header_btn a{background-color: #ff9907; font-size: 1.1em;line-height: 1.1em; font-weight: bold;padding: 12px 33px 10px 20px;border-radius: 6px;box-shadow: 1px 1px 4px 2px rgb(0 0 0 / 30%);color:#fff;
		position: relative; -webkit-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    -o-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);}
	
@media screen and (max-width: 1000px){
	.snsicon {font-size: 0.7em; gap:5px;margin-right: 8px;margin-top:4px;}
.snsicon img {width:36px; }
	.header_tel { font-size: 1.4em; padding: 0 10px 0 10px; margin-right: 15px;margin-top:4px;}
	.header_tel::before {  content: url(../img/common/headericon_tel.png);  display: inline-block; position:relative; top: 6px;  transform: scale(0.8);}
	.header_btn a{font-size: 1.0em;line-height: 1.1em; padding: 12px 25px 10px 15px;}
}
@media screen and (max-width: 860px){
	.snsicon {font-size: 0.6em; gap:2px;margin-right: 5px;margin-top:6px;}
.snsicon img {width:32px; }
	.header_tel { font-size: 1.2em; padding: 0 6px 0 6px; margin-right: 5px;margin-top:5px;}
	.header_tel::before {  content: url(../img/common/headericon_tel.png);  display: inline-block; position:relative; top: 6px;  transform: scale(0.7);}
	.header_btn a{font-size: 0.8em;line-height: 1.1em; padding: 12px 25px 10px 10px;}
}
.header_btn a::after {
    content: "";
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 4px);
    right: 15px;
}
.header_btn a:hover{
	color: #fff;
	background-color: #ff6905;
	text-decoration: none;
}

.header_btn a:hover::after{
	border-top-color: #fff;
	border-right-color: #fff;
}
.header_pc .nav_pc nav ul li a:before,.header_kaso .nav_pc nav ul li a:before {
  content: "";
  display: block;
  background: no-repeat center center;
  height: 35px;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.header_pc .nav_pc nav ul li.system a:before,.header_kaso .nav_pc nav ul li.system a:before {
  background-image: url(../img/common/icon_nav01.png);}
.header_pc .nav_pc nav ul li.system a:hover:before,.header_kaso .nav_pc nav ul li.system a:hover:before {
  background-image: url(../img/common/icon_nav01_o.png);}
.header_pc .nav_pc nav ul li.faq a:before,.header_kaso .nav_pc nav ul li.faq a:before {
  background-image: url(../img/common/icon_nav02.png);}
.header_pc .nav_pc nav ul li.faq a:hover:before,.header_kaso .nav_pc nav ul li.faq a:hover:before {
  background-image: url(../img/common/icon_nav02_o.png);}
.header_pc .nav_pc nav ul li.flow a:before,.header_kaso .nav_pc nav ul li.flow a:before {
  background-image: url(../img/common/icon_nav03.png);}
.header_pc .nav_pc nav ul li.flow a:hover:before,.header_kaso .nav_pc nav ul li.flow a:hover:before {
  background-image: url(../img/common/icon_nav03_o.png);}
.header_pc .nav_pc nav ul li.price a:before,.header_kaso .nav_pc nav ul li.price a:before {
  background-image: url(../img/common/icon_nav04.png);}
.header_pc .nav_pc nav ul li.price a:hover:before,.header_kaso .nav_pc nav ul li.price a:hover:before {
  background-image: url(../img/common/icon_nav04_o.png);}
.header_pc .nav_pc nav ul li.beforeafter a:before,.header_kaso .nav_pc nav ul li.beforeafter a:before {
  background-image: url(../img/common/icon_nav05.png);}
.header_pc .nav_pc nav ul li.beforeafter a:hover:before,.header_kaso .nav_pc nav ul li.beforeafter a:hover:before {
  background-image: url(../img/common/icon_nav05_o.png);}
.header_pc .nav_pc nav ul li.reform a:before,.header_kaso .nav_pc nav ul li.reform a:before {
  background-image: url(../img/common/icon_nav06.png);}
.header_pc .nav_pc nav ul li.reform a:hover:before,.header_kaso .nav_pc nav ul li.reform a:hover:before {
  background-image: url(../img/common/icon_nav06_o.png);}
.header_pc .nav_pc nav ul li.company a:before,.header_kaso .nav_pc nav ul li.company a:before {
  background-image: url(../img/common/icon_nav07.png);}
.header_pc .nav_pc nav ul li.company a:hover:before,.header_kaso .nav_pc nav ul li.company a:hover:before {
  background-image: url(../img/common/icon_nav07_o.png);}
@media screen and (max-width: 850px){
.header_pc .nav_pc nav ul li a,.header_kaso .nav_pc nav ul li a {  width: 100px;}
	}
	
@media screen and (max-width: 767px){
.header_pc,.header_kaso {  display: none;}
.header {width:100%; height: 60px; margin:0;  display: flex;  justify-content: center;  align-items: center;  padding: 5px 8px;  background-color: rgba(255,255,255,1.0); position: fixed;z-index: 80;}
.logoWrap {width:100%;display: flex;}
.logo {width:50%; margin: 10px 0 0 0; display: flex; justify-content: center;}
.logo img {width:90%;}
.logo2 {width:95%; margin: 10px 0 0 0; }
.logo2 img {width:50%;}
.header_tel {  margin:20px 17.8%;}
.header_btn {width:70%; margin:20px 15% 30px;}
}
.snsicon_sp {width:110px; font-size: 0.6em; display: flex;flex-wrap: wrap; gap:0 15px; align-items: flex-end; margin-right: 30px;font-weight: 600; justify-content: center;}
.snsicon_sp img {width:40px; }
@media screen and (max-width: 500px){
	.logo {width:50%;}
	.logo img {width:95%;}
	.snsicon_sp {width:22%; font-size: 0.4em;margin-right: 10px;gap:0 10px;}
	.snsicon_sp img {width:36px; }
}
@media screen and (max-width: 420px){
.snsicon_sp {gap:0 8px; margin-right: 20px;}
.snsicon_sp img {width:30px; }	
}
@media screen and (max-width: 330px){
.snsicon_sp {gap:0 8px; margin-right: 10px;}
.snsicon_sp img {width:25px; }	
}
@media screen and (max-width: 280px){
	.drawer_open {  position: absolute; left: 30px;}
	.logo {width:40%; margin: 10px 0 0 0; }
	.logo img {width:110%;}
}

.scroll-nav {box-shadow: 2px 2px 4px 1px rgb(0 0 0 / 20%);}

/*　ハンバーガーメニューボタン　*/
.hamburger {
  display : block;
  position: fixed;
  z-index : 3;
  right : 30px;
  top   : 10px;
  width : 25px;
  height: 25px;
  cursor: pointer;
  text-align: center;
}
.hamburger span {
  display : block;
  position: absolute;
  width   : 30px;
  height  : 2px ;
  left    : 6px;
  background : #000;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition   : 0.3s ease-in-out;
  transition        : 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
  top: 10px;
}
.hamburger span:nth-child(2) {
  top: 20px;
}
.hamburger span:nth-child(3) {
  top: 30px;
}

/* スマホメニューを開いてる時のボタン */
.hamburger.active span:nth-child(1) {
  top : 16px;
  left: 6px;
  background :#000;
  -webkit-transform: rotate(-45deg);
  -moz-transform   : rotate(-45deg);
  transform        : rotate(-45deg);
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
  top: 16px;
  background :#000;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
}

/* メニュー背景　*/
nav.globalMenuSp {
  position: fixed;
  z-index : 2;
  top  : 0;
  left : 0;
  color: #000;
  background: rgba( 255,255,255,1.0 );
  text-align: center;
  width: 100%;
  transform: translateX(-100%);
  transition: all 0.6s;
}

nav.globalMenuSp ul {
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

nav.globalMenuSp ul li {
  list-style-type: none;
	text-align: left;
  padding: 5px 0 0 20%;
  width: 100%;
  transition: .4s all;
}
nav.globalMenuSp ul li:last-child {
  padding-bottom: 0;
}
nav.globalMenuSp ul li:hover{
  background :#ffeb0f;
}

nav.globalMenuSp ul li a {
  display: block;
  color: #000;
  padding: 0.6em 0;
  text-decoration :none;
}

/* クリックでjQueryで追加・削除 */
nav.globalMenuSp.active {
  opacity: 100;
  display: block;
   transform: translateX(0%);
}
.system_sp {background: url(../img/common/icon_nav01.png) no-repeat 10px center;}
.faq_sp {background: url(../img/common/icon_nav02.png) no-repeat 10px center;}
.flow_sp {background: url(../img/common/icon_nav03.png) no-repeat 13px center;}
.price_sp {background: url(../img/common/icon_nav04.png) no-repeat 15px center;}
.beforeafter_sp {background: url(../img/common/icon_nav05.png) no-repeat 10px center; background-size: 15%;}
.reform_sp {background: url(../img/common/icon_nav06.png) no-repeat 10px center;}
.company_sp {background: url(../img/common/icon_nav07.png) no-repeat 12px center;}

/* .viewer
------------------------- */
.viewer {
	margin: 0 auto;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.viewer ul {
	width: 100%;
	overflow: hidden;
	position: relative;
}
.viewer ul li {
	top: 0;
	left: 0;
	width: 100%!important;
	position: absolute;
}
.viewer ul li img {
	width: 100%;
}
@media screen and (max-width: 767px){
	.viewer {height: 80%!important;}
	.viewer ul {height: 600px!important;}
}
@media screen and (max-width: 420px){
	.viewer {height: 80%!important;}
	.viewer ul {height: 400px!important;}
}
@media screen and (max-width: 280px){
	.viewer {height: 70%!important;}
	.viewer ul {height: 350px!important;}
}
/* sideNavi
------------------------- */
.viewer .btnPrev,
.viewer .btnNext {
	margin-top: -25px;
	top: 50%;
	width: 50px;
	height: 50px;
	position: absolute;
	z-index: 51;
}
.viewer .btnPrev {
	left: 10px;
	background: #ccc url(../img/btnPrev.jpg) no-repeat center center;
}
.viewer .btnNext {
	right: 10px;
	background: #ccc url(../img/btnNext.jpg) no-repeat center center;
}


/* =======================================
	ClearFixElements
======================================= */
.viewer ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.viewer ul {
	display: inline-block;
	overflow: hidden;
}


/*-----------------------------------------
  アンカー調整
-----------------------------------------*/
a.anchor {
    display: block;
    padding-top: 100px;
    margin-top: -100px;
}
@media screen and (max-width: 767px){
a.anchor {
    display: block;
  padding-top:60px;
  margin-top:-60px;
}
}

/*-----------------------------------------
  such
-----------------------------------------*/
.such {width:100%; margin-top:-15px; padding:70px 0 100px; background: url("../img/top/suchbg.png") bottom right no-repeat;}
h2 { color:#333;width:100%; margin-bottom: 60px; text-align: center; font-size: 2.0em; line-height: 1.7em; position: relative;}
.toptitle::after {
    content: "";
    width: 120px;
    height: 20px;
    border-bottom: 1px solid #ff9907;
    position: absolute;
    bottom:-10px;
    right: calc(50% - 60px);
}
.suchcont {width:100%; margin-top:20px;}
.suchcont ul {width:100%; display:flex; justify-content:space-between; flex-wrap: wrap;}
.suchcont li {width:23.5%; margin-bottom: 20px; }
.suchcont li img {width:100%; }
.such p {font-size: 1.2em; font-weight: bold;}
.such p b {color:#ff3300;}
@media screen and (max-width: 1015px){
	.suchcont {width:80%; margin:0 10%;}
}
@media screen and (max-width: 767px){
.such {padding:20px 0 60px;  background-size: 25%;}
h2 {margin-bottom: 30px;font-size: 1.2em;}
.toptitle::after {
    content: "";
    width: 40px;
    height: 1px;
    border-bottom: 1px solid #ff9907;
    position: absolute;
    bottom:-10px;
    right: calc(50% - 20px);
}
.suchcont {width:100%;margin:0;}
.suchcont li {margin-bottom: 10px; }
.such p {font-size: 0.8em;}
	}
@media screen and (max-width: 420px){
	.such {padding:30px 0 60px; }
	h2 {margin-bottom: 30px;font-size: 1.1em;}
	.suchcont {width:94%;margin:0 3%;}
	.suchcont li {width:47%; margin-bottom: 10px; }
	.only_o420 {display:none;}
}
/*-----------------------------------------
  reason
-----------------------------------------*/
.reason {width:100%; padding:70px 0 50px; background-color: #efefef; }
.reasoncont {width:80%; margin: 0 10%; font-weight: bold; }
.reasoncont li {list-style:disc; margin-bottom: 10px;}
.reasoncont li span {color:#ff3300;}

@media screen and (max-width: 767px){
.reason {padding:40px 0 30px; font-size: 0.9em; line-height: 1.5em;}
.reasoncont {width:90%; margin: 0 3% 0 7%; }
	}
@media screen and (max-width: 280px){

}
/*-----------------------------------------
  point
-----------------------------------------*/
.point1 {width:100%; padding:5px 0 30px;background: #ffdc38 url("../img/top/contbg01.png") top right no-repeat; background-size: contain; color: #000;}
.point1_panel { width:60%; }
.point1 h3 { width:100%; font-weight: bold;font-size:1.6em; padding: -5px 0 15px 0;  }
.point1 h3::after {content: url(../img/top/point01.png);display: inline-block; position:relative; top: 20px; right:10px;}
.point_txt {width:100%; font-size: 1.1em; margin-top:10px;}
.point_btn {width:70%; margin:20px 20% 20px auto; float:right; display: flex; background-color: #fff; box-shadow: 1px 1px 4px 2px rgb(0 0 0 / 30%); position: relative; align-items: center; 
	-webkit-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    -o-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);}
.point_btn2 {width:80%; margin:20px 10% 20px auto; float:right; display: flex; background-color: #fff; box-shadow: 1px 1px 4px 2px rgb(0 0 0 / 30%); position: relative; align-items: center; 
	-webkit-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    -o-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);}
.point_btn img,.point_btn2 img {width:40%;}
.point_btn p,.point_btn2 p {padding: 10px 25px 10px 15px;font-weight: bold;}
a .point_btn p,a .point_btn2 p {color: #333;}
.point_btn::after,.point_btn2::after {
    content: "";
    width: 12px;
    height: 12px;
    border-top: 1px solid #ff3300;
    border-right: 1px solid #ff3300;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 5px);
    right: 15px;
}
.point_btn:hover,.point_btn2:hover{
	text-decoration: none;
	transform: scale(1.05);
}

.point2 {width:100%; padding:5px 0 30px;background: url("../img/top/contbg02.png") top left no-repeat; background-size: contain; }
.point2_panel { width:50%; float:right; }
.point2 h3,.point4 h3,.point5 h3 { width:100%; font-weight: bold;font-size:1.6em; padding: -5px 0 15px 0; color:#ff3300; }
.point2 h3::after,.point4 h3::after,.point5 h3::after {content: url(../img/top/point02.png);display: inline-block; position:relative; top: 20px; right:10px;}
.point3 {width:100%; padding:5px 0 30px;background: #ffe382 url("../img/top/contbg03.png") top right no-repeat; background-size: contain; }
.point3 h3 { width:100%; font-weight: bold;font-size:1.6em; padding: -5px 0 15px 0;  }
.point3 h3::after {content: url(../img/top/point03.png);display: inline-block; position:relative; top: 20px; right:10px;}
.point4 {width:100%; padding:5px 0 30px;background: url("../img/top/contbg04.png") top left no-repeat; background-size: contain; }
.point5 {width:100%; padding:5px 0 30px;background: #fffedd url("../img/top/contbg05.png") top right no-repeat; background-size: contain; }

@media screen and (max-width: 1000px){
.point1 {width:100%; padding:5px 0 30px;background: #ffdc38 url("../img/top/contbg01r.png") top right no-repeat; background-size: contain; color: #000;}
.point2 {width:100%; padding:5px 0 30px;background: url("../img/top/contbg02r.png") top left no-repeat; background-size: contain; }	
.point3 {width:100%; padding:5px 0 30px;background: #ffe382 url("../img/top/contbg03r.png") top right no-repeat; background-size: contain; }
.point4 {width:100%; padding:5px 0 30px;background: url("../img/top/contbg04r.png") top left no-repeat; background-size: contain; }
.point5 {width:100%; padding:5px 0 30px;background: #fffedd url("../img/top/contbg05r.png") top right no-repeat; background-size: contain; }
	.point1_panel { width:80%; }.point_btn {width:50%; margin:20px 40% 20px auto;}
	.point2_panel { width:60%; }.point_btn2 {width:70%; margin:20px 10% 20px auto;}
}
@media screen and (max-width: 767px){
.point1 {width:100%; padding:20px 0 20px;background: #ffdc38;  }
.point2,.point4 {width:100%; padding:20px 0 20px;background:#fff;  }
.point3 {width:100%; padding:20px 0 20px;background:#ffe382;  }
.point5 {width:100%; padding:20px 0 20px;background:#fffedd;  }
.point1_panel,.point2_panel { width:90%; margin:0 5%;}
.point1 h3,.point2 h3,.point3 h3,.point4 h3,.point5 h3 { text-align: center;}
.point1 h3 img,.point2 h3 img,.point3 h3 img,.point4 h3 img,.point5 h3 img {width:100%;}
.point1 h3::after,.point2 h3::after,.point3 h3::after,.point4 h3::after,.point5 h3::after {display: none;}
.point_txt {font-size:0.8em;}
.point_btn,.point_btn2 {width:80%; margin:20px 10% 20px 10%;}
.point_btn p,.point_btn2 p {font-size:0.8em; line-height: 1.5em; }
	}
@media screen and (max-width: 280px){
	.point_txt {font-size:0.6em;}
	.point_btn,.point_btn2 {width:100%; margin:20px 0 20px 0;}
	.point_btn p,.point_btn2 p {font-size:0.7em; line-height: 1.4em;}
}


/*-----------------------------------------
  topnews
-----------------------------------------*/
.topnews {width:100%; padding:70px 0 100px; }
.topnews_cont {width:100%; text-align: center; }

@media screen and (max-width: 767px){
.topnews {padding:40px 0 40px; }
.topnews_cont iframe {width:100%; }
	}

/*-----------------------------------------
  toiawase
-----------------------------------------*/
.toiawase {width:100%; padding:70px 0 100px; }
.toiawasecont {width:100%; display: flex; justify-content: space-between;}
.mitumoribtn {width:47%; padding:15px 15px;border:solid 2px #ff9907; color: #fff; background-color: #ff6f0f; border-radius: 10px; text-align: center;}
.mitumorititle{font-size: 1.8em;font-weight: bold;}
.mitumoritxt {font-size: 1.2em;font-weight: bold;}
.contact_tel{width:47%; padding:15px 15px 5px;border:solid 2px #ffeb0f; color: #000; background: linear-gradient(180deg, rgb(255, 245, 200), rgb(255, 221, 102)); border-radius: 10px; text-align: center;}
.contact_teltitle{font-size: 1.7em;font-weight: bold; line-height: 1.4em;margin-bottom: 10px;}
.contact_tel p{font-size: 0.9em;font-weight: bold; line-height: 1.4em;}

@media screen and (max-width: 767px){
.toiawase {padding:40px 0 40px; }
.toiawasecont {flex-direction: column;}
.mitumoribtn {width:100%;margin-bottom: 20px;padding:5px 5px 10px;}
.mitumorititle{font-size: 1.3em; line-height: 1.4em;}
.mitumoritxt {font-size: 0.9em;}
.contact_tel {width:100%;padding:5px 5px;}
.contact_teltitle{font-size: 1.3em;}
.contact_tel p{font-size: 0.8em;}
.contact_tel img {width:80%;}
	}
@media screen and (max-width: 280px){

}
/*-----------------------------------------
  detail_btn
-----------------------------------------*/
.detail_btn {width:94%; margin: 20px auto 0;}
.detail_btn a {
    display: block;
    text-align: center;
    position: relative;
    border-radius: 6px;
	color:#000;
	font-size: 1.5em;
	font-weight: bold;
	background-color: #ffeb0f;
	box-shadow: 1px 1px 4px 2px rgb(0 0 0 / 30%);
    padding: 10px 50px 10px 30px;
    text-decoration: none;
    -webkit-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    -o-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
}

.detail_btn a::after {
    content: "";
    width: 12px;
    height: 12px;
    border-top: 2px solid #000;
    border-right: 2px solid #000;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 5px);
    right: 25px;
}
.detail_btn a:hover{
	background-color: #fff;
	text-decoration: none;
	transform: scale(1.05);
}

.detail_btn a:hover::after{
}

@media screen and (max-width: 767px){
.detail_btn {margin: 0 auto 0;}
.detail_btn a { font-size: 1.1em;padding: 10px 20px 10px 10px;}
.detail_btn a::after {
    content: "";
    width: 7px;
    height: 7px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 3px);
    right: 10px;
}
}

@media screen and (max-width: 280px){
.detail_btn a { font-size: 0.7em;}
}
@media screen and (min-width: 281px){
	.only_u280 {display: none;}
	}
/*-----------------------------------------
  下層KV
-----------------------------------------*/
.kasokv {width:100%; height:140px; overflow: hidden; background-color: #ececec;}
.kv_system {background: url(../img/system/kv.jpg) no-repeat center center ; background-size: cover;}
.kv_faq {background: url(../img/faq/kv.jpg) no-repeat center center ; background-size: cover;}
.kv_flow {background: url(../img/flow/kv.jpg) no-repeat center center ; background-size: cover;}
.kv_price {background: url(../img/price/kv.jpg) no-repeat center center ; background-size: cover;}
.kv_beforeafter {background: url(../img/beforeafter/kv.jpg) no-repeat center center ; background-size: cover;}
.kv_reform {background: url(../img/reform/kv.jpg) no-repeat center center ; background-size: cover;}
.kv_company {background: url(../img/company/kv.jpg) no-repeat center center ; background-size: cover;}
.kv_contact {background: url(../img/contact/kv.jpg) no-repeat center center ; background-size: cover;}
.kv {max-width: 1000px; margin:50px auto; text-align: center; font-size: 1.5em; }
.kv2 {max-width: 1000px; margin:30px auto; text-align: center; font-size: 1.5em; }

@media screen and (max-width: 999px)
{
	.kasokv {width:100%; height:85%;}
	.kv_system {background: url(../img/system/kv.jpg) no-repeat center center ; background-size: cover;}
	.kv_faq {background: url(../img/faq/kv_sp.jpg) no-repeat center right ; background-size: cover;}
	.kv_flow {background: url(../img/flow/kv.jpg) no-repeat center right ; background-size: cover;}
	.kv_price {background: url(../img/price/kv.jpg) no-repeat center right ; background-size: cover;}
	.kv_beforeafter {background: url(../img/beforeafter/kv.jpg) no-repeat center center ; background-size: cover;}
	.kv_reform {background: url(../img/reform/kv.jpg) no-repeat center right ; background-size: cover;}
	.kv_company {background: url(../img/company/kv.jpg) no-repeat center right ; background-size: cover;}
	.kv_contact {background: url(../img/contact/kv.jpg) no-repeat center right ; background-size: cover;}
	.kv,.kv2 {width: 90%; margin:50px 5%;  font-size: 1.6em; }
}
@media screen and (max-width: 768px)
{
	.kasokv {width:100%; height:150px; }
	.kv_system {background: url(../img/system/kv_sp.jpg) no-repeat center center ; background-size: cover;}
	.kv_faq {background: url(../img/faq/kv_sp.jpg) no-repeat center right ; background-size: cover;}
	.kv_flow {background: url(../img/flow/kv_sp.jpg) no-repeat center right ; background-size: cover;}
	.kv_price {background: url(../img/price/kv_sp.jpg) no-repeat center right ; background-size: cover;}
	.kv_beforeafter {background: url(../img/beforeafter/kv_sp.jpg) no-repeat center center ; background-size: cover;}
	.kv_reform {background: url(../img/reform/kv_sp.jpg) no-repeat center center ; background-size: cover;}
	.kv_company {background: url(../img/company/kv_sp.jpg) no-repeat center right ; background-size: cover;}
	.kv_contact {background: url(../img/contact/kv_sp.jpg) no-repeat center right ; background-size: cover;}
.kv {width: 90%; margin:87px 5%;  font-size: 1.2em;  text-align: left;}
.kv2 {width: 90%; margin:77px 5%;  font-size: 1.2em; line-height: 1.3em; text-align: left;}
}
@media screen and (max-width: 280px){
.kv,.kv2 {width: 90%; margin:80px 5%;  font-size: 0.9em;  }
}
.flowzu {margin: 40px auto 0; text-align: center;}
/*-----------------------------------------
  system
-----------------------------------------*/
.system1 {width:100%; padding:50px 0;background: url("../img/system/bg01.png") top right no-repeat; background-size: contain; }
.system2 {width:100%; padding:50px 0;background: url("../img/system/bg02.png") top left no-repeat; background-size: contain; }
.system3 {width:100%; padding:50px 0;background: url("../img/system/bg03.png") top right no-repeat; background-size: contain; }
.system4 {width:100%; padding:50px 0;background-color: #f9f9f9;text-align: center;}
.system5 {width:100%; padding:50px 0; }
.system1_panel { width:60%; }
.system2_panel { width:50%; float: right;}
.system4_panel { width:90%; margin:0 auto;}
.system5_panel { width:100%; }
.kaso_title { width:100%; font-weight: bold;font-size:1.7em; line-height: 1.0em; padding: 5px 0 5px 15px; border-left: solid 12px #ff9907;  margin-bottom: 30px;}
.kaso_title2 { font-weight: bold;font-size:1.6em; padding: 5px 0 5px 15px; margin-bottom: 30px; position:relative;}
.kaso_title2:before {
  content: " ";
  display: inline-block;
  border-left: solid 12px #ff9907;
  position: absolute;left: -10px;top:3px;  height:40px;
}
.system_txt {width:100%; margin-top:10px;}
@media screen and (max-width: 1000px){
.system1 {width:100%; padding:50px 0;background: url("../img/system/bg01r.png") top right no-repeat; background-size: contain; }
.system2 {width:100%; padding:50px 0;background: url("../img/system/bg02r.png") top left no-repeat; background-size: contain; }
.system3 {width:100%; padding:50px 0;background: url("../img/system/bg03r.png") top right no-repeat; background-size: contain; }
}
@media screen and (max-width: 767px){
.system1,.system2,.system3 {width:100%; padding:20px 0 20px; background:#fff;}
.system4{text-align: left;}
.system5 {width:100%; padding:50px 0 10px; }
.system1_panel,.system2_panel,.system4_panel,.system5_panel { width:90%; margin:0 5%;}
.kaso_title { font-size:1.3em; line-height: 1.3em;}
.kaso_title2 { font-size:1.0em; line-height: 1.1em;border-left: solid 12px #ff9907;}
.kaso_title2:before {
  border-left: none;
}
.system_txt {font-size:0.9em;}
	}
@media screen and (max-width: 280px){
.kaso_title { font-size:0.9em; line-height: 1.0em;}
.system_txt {font-size:0.6em;}
.system4 p{font-size:0.6em;}
}
/*テーブル*/
.system_table {
table-layout:fixed;
width:100%;  margin: 35px auto 20px;  text-align: left;border-collapse:collapse;
}
.system_table th{ padding: 10px 10px 10px 20px; line-height: 1.5; background-color: #eaeaea; border:solid 1px #eaeaea;}
.system_table td{ padding: 10px 10px 10px 20px; line-height: 1.5; border-bottom: solid 1px #c0c0c0;}
.systemth1 {width:27%;}
.systemth2 {width:17%;}
.systemth3 {width:12%;}

@media screen and (max-width: 768px)
{
.system_table {width:100%; position: relative;margin: 75px auto 20px;}
.system_table .thead { display: none; }
.system_table th{ padding: 10px 5px 10px 5px; display:block; width:100%;}
.system_table td{ padding: 10px 5px 10px 5px; display:block; width:100%;position: relative;text-align: center;}
.system_table td:first-child:before {
    content: "各部：下地：使用塗料：保証年数";
    background: #ffeb0f;
    box-sizing: border-box;
    color: #000;
    font-weight: bold;
    height: 40px;
    padding: 10px;
    position: absolute;
    top: -41px;
    left: -0.2%;
    display: block;
    width: 100.5%;
	text-align: center;
  }
  .system_table tr:after { 
	  content: "";
      height: 40px;
    display: block;
    width: 100%;}
}
@media screen and (max-width: 280px){
.system_table th{ font-size: 0.8em;}
.system_table td{ font-size: 0.8em;}
}

/*-----------------------------------------
  faq
-----------------------------------------*/
.faqcont {width:100%; padding:40px 0 50px; }
/* qa */
.qa {width: 100%; margin:20px 0;}
.qa dl {width: 100%;margin: 0 auto; border-bottom:solid 1px #c9c9c9;padding: 30px 0;}
.qa dt {color:#ff3300; padding-left: 2.2em;	text-indent: -2.3em;line-height: 1.4;padding-bottom: 15px; font-size: 1.1em;}
.qa dt::before {content: 'Q.';font-size: 1.2em;	margin-right: 20px;	color: #ff3300;}
.qa dd {padding-left: 2.2em;text-indent: -2.3em;}
.qa dd::before {content: 'A.';font-size: 1.1em; margin-right: 20px; margin-left: 3px;	}

@media screen and (max-width: 767px){
	.faqcont { padding:0 10px 20px;}
		.qa {font-size: 0.8em;}
	}
/*-----------------------------------------
  flow
-----------------------------------------*/
.flowcont {width:100%; padding:40px 0 50px; }
.flowpanel {width:100%; background-color: #eeeeee; padding: 10px 10px 5px; display: flex; justify-content: space-between;margin-bottom: 20px;}
.flowpanel2 {width:100%; background-color: #f6f6f6; padding: 10px 10px 5px; display: flex; justify-content: space-between;margin-bottom: 20px;}
.flowtxt {width:60%}
.flowtitle {display: flex; align-items: baseline; }
.flownum {width:55px; background-color: #ff6f0f; color: #fff; font-size: 2.5em;font-weight: bold; text-align: center; line-height: 1.2em;}
.reflownum {width:55px; background-color: #ffeb0f; color: #000; font-size: 2.5em;font-weight: bold; text-align: center; line-height: 1.2em;}
.flow_title {color: #ff3300;font-size: 1.4em;font-weight: bold; margin:0 0 0 20px; }
.flowtxt p {margin: 10px 0;}
.flowimg {width:35%}
@media screen and (max-width: 767px){
	.flowpanel,.flowpanel2 {flex-direction: column-reverse;font-size: 0.8em;}
	.flowtxt {width:100%;}
	.flowimg {width:100%; text-align: center;}
}
@media screen and (max-width: 280px){
	.flowpanel,.flowpanel2 {font-size: 0.6em;}
}
/*-----------------------------------------
  price
-----------------------------------------*/
.price_reason,.paintkind{width:100%; padding:40px 0 50px; background-color: #fff;}
.pricecont {width:100%; display: flex; justify-content: space-between; margin-top: 80px;}
.pricepanel {width:32%; border: solid 2px #ff6f0f;position: relative; padding: 15px; text-align: center;}
.pricereason {width:45%; padding: 0; background-color:#ff6f0f; text-align: center;color: #fff; font-weight: bold; margin:-60px auto 0 auto; align-items:center;font-size: 1.1em;}
.pricereason span {font-size: 2.2em; }
.priceimg {padding: 5px 0;}
.pricetitle {font-size: 1.2em; font-weight: bold;color: #ff3300;}
.pricepanel p {width:98%;margin: 5px 1%; text-align: left;}

.pricetable{width:100%; padding:40px 0 50px; background-color: #f6f6f6;}

@media screen and (max-width: 767px){
	.pricecont {flex-direction: column;font-size: 0.8em;margin-top: 0;}
	.pricepanel {width:100%;margin-top: 40px;}
	.pricereason { margin:-40px auto 0 auto;}
}

@media screen and (max-width: 280px){
	.pricecont {font-size: 0.6em;}
}
/*テーブル*/
.price_table {
table-layout:fixed;
width:94%;  margin: 35px auto 20px;  text-align: left;border-collapse:collapse;
}
.price_table th{ padding: 10px 30px 10px 10px; line-height: 1.5; background-color: #eaeaea; border:solid 1px #eaeaea;}
.price_table td{ padding: 10px 30px 10px 10px; line-height: 1.5; border-bottom: solid 1px #c0c0c0;}
.priceth1 {width:20%; text-align: center;}
.priceth2,.priceth3 {width:40%;text-align: right;}
.price_table th span {font-size: 0.8em;}

@media screen and (max-width: 768px)
{
.price_table {width:100%; position: relative;margin: 75px auto 20px;}
.price_table .thead { display: none; }
.price_table th{ padding: 10px 5px 10px 5px; display:block; width:100%;}
.price_table td{ padding: 10px 5px 10px 5px; display:block; width:100%;position: relative;text-align: center;}
.price_table td:first-child:before {
    content: "建坪：外壁塗装：外壁・屋根塗装";
    background: #ffeb0f;
    box-sizing: border-box;
    color: #000;
    font-weight: bold;
    height: 40px;
    padding: 10px;
    position: absolute;
    top: -41px;
    left: -0.2%;
    display: block;
    width: 100.5%;
	text-align: center;
  }
  .price_table tr:after { 
	  content: "";
      height: 40px;
    display: block;
    width: 100%;}
}
@media screen and (max-width: 280px){
.price_table th{ font-size: 0.8em;}
.price_table td{ font-size: 0.8em;}
}
/*テーブル*/
.kind_table {
table-layout:fixed;
width:94%;  margin: 35px auto 20px;  text-align: left;border-collapse:collapse;
}
.kind_table th{ padding: 10px 10px 10px 30px; line-height: 1.5; background-color: #eaeaea; border:solid 1px #eaeaea;}
.kind_table td{ padding: 10px 10px 10px 30px; line-height: 1.5; border-bottom: solid 1px #c0c0c0;}
.kindth1 {width:25%; }
.kindth2 {width:25%;}
.kind_table th span {font-size: 0.8em;}

@media screen and (max-width: 768px)
{
.kind_table {width:100%; position: relative;margin: 75px auto 20px;}
.kind_table .thead { display: none; }
.kind_table th{ padding: 10px 5px 10px 5px; display:block; width:100%;}
.kind_table td{ padding: 10px 5px 10px 5px; display:block; width:100%;position: relative;text-align: center;}
.kind_table td:first-child:before {
    content: "塗料種類：耐久年数：特徴";
    background: #ffeb0f;
    box-sizing: border-box;
    color: #000;
    font-weight: bold;
    height: 40px;
    padding: 10px;
    position: absolute;
    top: -41px;
    left: -0.2%;
    display: block;
    width: 100.5%;
	text-align: center;
  }
  .kind_table tr:after { 
	  content: "";
      height: 40px;
    display: block;
    width: 100%;}
}
@media screen and (max-width: 280px){
.kind_table th{ font-size: 0.8em;}
.kind_table td{ font-size: 0.8em;}
}

/*-----------------------------------------
  beforeafter
-----------------------------------------*/
.beforeaftercont{width:100%; padding:40px 0 50px; }
.beforeafterpanel {width:100%; margin:60px 0 0;position: relative;}
.beforeafterimg {width:100%;}
.beforeafterimg img {width:100%;}
.beforeaftertitle {color: #ff3300; font-weight: bold;margin-top:10px;}

@media screen and (max-width: 768px){
.beforeafterpanel{ font-size: 0.8em;margin:30px 0 0;}
}



/*-----------------------------------------
  btn_toreform
-----------------------------------------*/
.btn_toreform {width:50%; margin: 50px 25%;}
.btn_toreform a {
    display: block;
    text-align: center;
    position: relative;
    border-radius: 6px;
	color:#fff;
	font-size: 1.5em;
	font-weight: bold;
	background: linear-gradient(180deg, rgb(255, 112, 15), rgb(255, 221, 102));
	box-shadow: 1px 1px 4px 2px rgb(0 0 0 / 30%);
    padding: 30px 50px 30px 30px;
    text-decoration: none;
    -webkit-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    -o-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
}

.btn_toreform a::after {
    content: "";
    width: 12px;
    height: 12px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 5px);
    right: 25px;
}
.btn_toreform a:hover{
	text-decoration: none;
	transform: scale(1.05);
}

.btn_toreform a:hover::after{
}

@media screen and (max-width: 767px){
.btn_toreform {width:80%; margin: 0 10% 0;}
.btn_toreform a { font-size: 1.1em;padding: 10px 20px 10px 10px;}
.btn_toreform a::after {
    content: "";
    width: 7px;
    height: 7px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 3px);
    right: 10px;
}
}

@media screen and (max-width: 280px){
.btn_toreform a { font-size: 0.7em;}
}

/*-----------------------------------------
  reform
-----------------------------------------*/
.reformcont{width:100%; padding:40px 0 50px; }
.reformpanel {width:100%; margin:60px 0 0;display: flex; justify-content: space-between;}
.reformtxt {width:55%; }
.reformimg {width:40%;}
.reformimg img {width:100%;}
@media screen and (max-width: 768px){
.reformcont{width:100%; padding:20px 0 30px; }
.reformpanel{ font-size: 0.8em; flex-direction: column-reverse;margin:20px 0 0;}
.reformtxt {width:100%; }
.reformimg {width:100%;}
}

.reformservice {width:100%; margin:60px 0 40px;display: flex; justify-content: space-between; flex-wrap: wrap;}
.reforms_panel {width:45%; padding: 15px; border: solid 2px #ffa70f; display: flex; margin: 30px 0 30px 30px;}
.reforms_title {width:130px; height: 130px; font-size: 1.2em; line-height: 1.4em; font-weight: bold; text-align: center;vertical-align: middle; align-items: center;margin:-40px 0 0 -40px; display: flex; justify-content: center;}
.reformicon01 {background: #ffeb0f url("../img/reform/icon01.png") center center no-repeat;}
.reformicon02 {background: #ffeb0f url("../img/reform/icon02.png") center center no-repeat;}
.reformicon03 {background: #ffeb0f url("../img/reform/icon03.png") center center no-repeat;}
.reforms_panel ul {margin:10px 0 10px 30px;}
.reforms_panel ul li {font-size: 1.1em;line-height: 1.4em;margin-bottom: 10px;}
.reforms_panel ul li span {font-size: 0.7em;}
.reforms_panel ul li:before{ 
  display:inline-block; 
  vertical-align: middle;
  content:'';
  width:10px;
  height: 10px;
  background: #ffa70f;
  border-radius: 50%;
  margin-right: 8px;
}

@media screen and (max-width: 768px){
	.reforms_panel {width:85%; flex-direction: column;}
	.reforms_title {width:60%; height: auto; font-size: 1.1em; line-height: 1.3em; margin:-40px 20% 0 20%; display: flex; justify-content: center; padding: 20px 0;}
	.reforms_panel ul {width:100%; margin:10px 0 10px 0;}
	.reforms_panel ul li {font-size: 0.9em;}
}

.reformfaq {width:100%; padding:40px 0 50px; background-color: #f9f9f9;}


/*-----------------------------------------
  company
-----------------------------------------*/
.companycont {width:100%; padding:40px 0 50px; }
/*テーブル*/
.company_table {
table-layout:fixed;
width:94%;  margin: 35px auto 50px;  text-align: left;border-collapse:collapse;border-top: solid 1px #c0c0c0;}
.company_table th{ width:22%; padding: 12px 10px 12px 30px; line-height: 1.5; background-color: #eaeaea; border:solid 1px #eaeaea;border-bottom: solid 1px #c0c0c0;}
.company_table td{ padding: 12px 10px 12px 30px; line-height: 1.5; border-bottom: solid 1px #c0c0c0; text-align: left;}
.company_table th:first-child {border-top: solid 1px #c0c0c0;}
@media screen and (max-width: 768px)
{
.company_table {width:100%; position: relative;margin: 75px auto 20px;}
.company_table th{ width:100%; padding: 10px 5px 10px 5px; display:block; }
.company_table td{ width:100%; padding: 10px 5px 10px 5px; display:block; position: relative;text-align: center;}
}
@media screen and (max-width: 280px){
.company_table th{ font-size: 0.8em;}
.company_table td{ font-size: 0.8em;}
}
/*アクセス*/
.maps {width:94%; margin: 20px 3% 20px; position: relative; padding-top: 56.25%;border: solid 1px #ccc;}
.maps iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;}

.companyservice {width:100%; padding:40px 0 50px; background-color: #f6f6f6;}
	
/*テーブル*/
.company_s_table {table-layout:fixed;width:94%;  margin: 35px auto 20px;  text-align: left;border-collapse:collapse;border-top: solid 1px #c0c0c0;}
.company_s_table th{ width:30%; padding: 10px 10px 10px 30px; line-height: 1.5; background-color: #eaeaea; border:solid 1px #eaeaea;border-bottom: solid 1px #c0c0c0;}
.company_s_table td{ padding: 10px 10px 10px 30px; line-height: 1.5; border-bottom: solid 1px #c0c0c0; text-align: left;}
.company_s_table th:first-child {border-top: solid 1px #c0c0c0;}
@media screen and (max-width: 768px)
{
.company_s_table {width:100%; position: relative;margin: 75px auto 20px;}
.company_s_table th{ width:100%; padding: 10px 5px 10px 5px; display:block; }
.company_s_table td{ width:100%; padding: 10px 5px 10px 5px; display:block; position: relative;}
}
@media screen and (max-width: 280px){
.company_s_table th{ font-size: 0.8em;}
.company_s_table td{ font-size: 0.8em;}
}
.company_s_table ul {margin:10px 0 10px 30px;}
.company_s_table ul li {padding:7px 0 5px;}
.company_s_table ul li:before{ 
  display:inline-block; 
  vertical-align: middle;
  content:'';
  width:10px;
  height: 10px;
  background: #ffa70f;
  border-radius: 50%;
  margin-right: 8px;
}

@media screen and (max-width: 768px){
	.company_s_table ul {width:100%; margin:10px 0 10px 0;}
	.company_s_table ul li {font-size: 0.9em;}
}
	
/*-----------------------------------------
  contact
-----------------------------------------*/
.contactcont {width:100%; padding:40px 0 50px;}
.contactcont p {width:100%; text-align: center; font-size: 1.0em;margin: 30px 0;}
@media screen and (max-width: 767px){
.contactcont {padding:20px 0 30px; }
.contactcont p {width:90%;font-size: 0.9em;margin: 20px 5%; text-align: left;}
	}
@media screen and (max-width: 280px){
.contactcont p {font-size: 0.7em;}
	}
/*---------------------------------------
	メールフォーム
-----------------------------------------*/
#formWrap {	width:100%;	margin:50px auto; }

table.formTable{
	width:90%;
	margin:50px auto 50px 10%;
	border-collapse:collapse;
}
table.formTable td,table.formTable th{
	padding:15px; 
}
table.formTable th{
	width:28%;
	font-weight:bold;
	text-align:left;
	vertical-align: middle;
}
table.formTable td{
	text-align:left; 
}

.formTable input {
  background: #f2f2f2;
  border: solid 1px #ccc;
  margin: 5px;
  padding: 20px;
  box-sizing: border-box;
  font-size: 1.0em;
}
.formTable input .formtxt {width:80%;}
.textarea{
	width:80%;
	background: #f2f2f2;
  border: solid 1px #ccc;
  margin: 10px;
  padding: 15px;
  box-sizing: border-box;
  font-size: 1.0em;}

.confirmbtns{width:100%;display: flex; justify-content: center;position: relative; }
.btn_contact
	{ width: 330px; height: 58px;position: relative; margin:0 20px;  background-color: #ff6f0f;  border-radius: 60px; color: #fff; border: solid 1px #ff6f0f;font-size: 1.2em;  
	cursor: pointer;-webkit-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    -o-transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
    transition: 0.3s cubic-bezier(0.18, 0.45, 0.25, 1);
}
#btn_confirm,#btn_reset,#btn_send,#btn_return {width: 330px; height: 58px;background-color: #ff6f0f;  border-radius: 60px; color: #fff; border: solid 1px #ff6f0f;font-size: 1.2em; }
.btn_contact::after {
    content: "";
	display: block;
    width: 12px;
    height: 12px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 5px);
    right: 25px;
}
.btn_contact:hover,#btn_confirm:hover,#btn_reset:hover,#btn_send:hover,#btn_return:hover{
	color: #fff;
	background-color: #ff3300;
	border: solid 1px #ff3300;
	text-decoration: none;
	cursor: pointer;
	transform: scale(1.05);
}

.btn_contact:hover::after{
	border-top-color: #fff;
	border-right-color: #fff;
}


.center {width:100%; text-align: center;}
.red {color: #e8390d; font-size: 0.9em;margin-left: 10px;}
.small {font-size: 0.7em;}

	
@media screen and (max-width: 768px){
#formWrap {	margin:30px auto; }
table.formTable{width:100%;margin:50px 0;}
table.formTable th{ display:block;	width:100%; padding:5px 10px 0;}
table.formTable td{ display:block;	width:100%; padding:0 10px 5px;}
.formTable input .formtxt {width:100%;}
.textarea{	width:100%; margin: 0;}
.confirmbtns{width:100%;display: flex; flex-flow: column; }
.btn_contact	{ width: 66%;margin:20px 17% 0;	}
#btn_confirm,#btn_reset,#btn_send,#btn_return{ width: 100%;margin:0;font-size: 0.9em;	}
.btn_contact::after {
    content: "";
	display: block;
    width: 10px;
    height: 10px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 5px);
    right: 15px;
}
}
.contact_text {text-align: center;}
@media screen and (max-width: 380px){
table.formTable{font-size: 0.8em;margin:30px 0;}
.formTable input {  font-size: 0.8em;}
}
@media screen and (max-width: 280px){
table.formTable{font-size: 0.8em;margin:30px 0;}
.formTable input {  font-size: 0.8em;}
.btn_contact	{ width: 80%;margin:20px 10% 0;	}
#btn_confirm,#btn_reset,#btn_send,#btn_return{ width: 100%;margin:0;font-size: 0.7em;	}
	
}
/*---------------------------------------
  common-footer
-----------------------------------------*/
.footer{width:100%; background-color: #efefef; padding: 40px 0 30px; }
.footer_in {width:100%; display: flex;justify-content: space-between;}
.footer_logo {  width: 14%; font-weight: bold;}
.footer_logo a {color: #000;}
.footer_menu{width:82%;}
.footer_menu ul{width:100%;display: flex;justify-content: space-between;}
.footer_menu ul li {margin-left:10px; padding-left: 20px;font-size: 0.8em; position: relative;}
.footer_menu ul li:before {
	content: "";
    width: 8px;
    height: 8px;
    border-top: 1px solid #ff6f0f;
    border-right: 1px solid #ff6f0f;
    transform: rotate(45deg);
    position: absolute;
    top: calc(50% - 4px);
    left: 1px;
	
}
.footer_menu a {  text-decoration: none; color: #000;}
.footer_menu a:hover {  color: #333333;  text-decoration: underline;}
.copy {	width:100%;	margin-top:40px; padding:5px; text-align: center; font-size: 0.7em; letter-spacing: 1px;}

@media screen and (max-width: 768px)
{
.footer_in {flex-direction: column;}
.footer_logo { width: 100%; margin: 0 0 20px;  }
.footer_menu{ width:100%; margin: 0; text-align: center;}
	.footer_menu ul{flex-wrap: wrap;}
.footer_menu ul li{	width: 46%;	margin: 2% 2% 3%;	padding: 10px 5px;border: #999 1px solid;background-color: #fff;text-align: center;	}
	.footer_menu ul li:before{display: none;}
.footer_menu ul li a {  display: block; line-height: 1.6em;}
.footer_menu ul li a:hover { text-decoration: none;}
.copy {  padding:10px; }
}
@media screen and (max-width: 300px)
{.footer_menu ul li{font-size:0.7em;}}

/*-----------------------------------------
  media
-----------------------------------------*/

@media screen and (min-width: 1135px){
	.only_pad {display: none;}
}
@media screen and (min-width: 768px)
{	.only_sp{display: none;}}
@media screen and (max-width: 767px)
{
.only_pc{display: none;}
}


/*---------------------------------------
  clearfix
-----------------------------------------*/
.clearfix:after {
  content: "."; 
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}
.clear {
  clear: both;
}