@charset "utf-8";
/*
theme Name: DRC ORIGINAL THEME
Author: DRC
Description: original theme
version： 1.0.0
*/



/* reset */

html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align:baseline;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
article, header, footer, aside, figure, figcaption, nav, section { 
  display:block;
}
body {
  line-height: 1;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
ol, ul {
  list-style: none;
  list-style-type: none;
}

html { margin:0 !important;}


/* clearfix */

.cf:after {
content: "";
clear: both;
display: block;
}



body {
font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif; font-size:16px; font-size: 16px;line-height: 1.7;
}

p { margin:0 0 15px;}


img {
  max-width: 100%;
  height: auto;
}

iframe {
  max-width: 100%;
}

	
h1, h2, h3, h4, h5, h6 {
  font-weight: bold;
}



/* wp */

.aligncenter,
div.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignleft {
   float: left;
}

.alignright {
   float: right;
}

.wp-caption {
   border: 1px solid #ddd;
   text-align: center;
   background-color: #f3f3f3;
   padding-top: 4px;
   margin: 10px;
   /* optional rounded corners for browsers that support it */
   -moz-border-radius: 3px;
   -khtml-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
}

.wp-caption img {
   margin: 0;
   padding: 0;
   border: 0 none;
}

.wp-caption p.wp-caption-text {
   font-size: 11px;
   line-height: 17px;
   padding: 0 4px 5px;
   margin: 0;
}





/* common */

#wrapper { width:100%;}
.inner { width:1000px!important; margin:0 auto;}

#contents { width:710px; float:right; margin-left:50px; }

.mgB80 { margin-bottom:80px !important;}
.mgT0 { margin-top:0 !important;}
.mgT80 { margin-top:80px !important;}
.pd0 { padding:0 !important;}

.red { color:red;}
.bold { font-weight:600;}

a img { transition: 0.5s;}
a img:hover { opacity: 0.6; transition: 0.5s;}


/* サブメニュー childpages使用時
.sub-menu { }
	.sub-menu li { border:1px #cccccc solid; background:linear-gradient(#ffffff,#f0f0f0); margin:10px 20px 10px 0; float:left;}
		.sub-menu li.last { margin-right:0;}
		.sub-menu li a { display:block; background:url(/img/sub-menu-arrow.png) no-repeat 8px 11px; padding:10px; padding-left:32px; width:176px; color:#757bce; text-decoration:none;}
		.top-sub-menu li a { width:169px;}
		.sub-menu li a:hover { text-decoration:underline; }
*/

.pagetop { display: none; position: fixed; bottom: 30px; right: 55px; }
.pagetop a { display: block; width: 70px; height: 56px; }






/* midashi */

h2.h2-1, #contents h2 { font-size:36px; margin-bottom:30px;}
h2.h2-1, #contents h2 {
display: flex;
align-items: center;
}
h2.h2-1:before, #contents h2:before,
h2.h2-1:after, #contents h2:after {
border-top: 1px #000 solid;
content: "";
flex-grow: 1;
}
h2.h2-1:before, #contents h2:before {
margin-right: 2rem;
}
h2.h2-1:after, #contents h2:after {
margin-left: 2rem;
}
h2.h2-1, #contents h2 { margin:70px 0 50px; font-weight:500;}
#contents h2:first-child { margin-top:0;}



/*
h3 {
     position: relative;
     padding:0.5em 0.5em 0.5em 1.4em;
     border: 1px solid #CCC;
     border-radius: 5px;
 font-size:24px;
 font-weight:500;
 margin:60px 0 30px;
}
 
h3::after {
     position: absolute;
     top: 50%;
     left:0.7em;
     transform:translateY(-50%);
     content: '';
     width: 5px;
     height:25px;
     background-color: #234199;
}
*/


/*

h3{
position: relative;
display: inline-block;
margin-bottom: 1em;
text-align:center;
}
h3:before {
content: '';
position: absolute;
bottom: -15px;
display: inline-block;
width: 60px;
height: 5px;
left: 50%;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
background-color: black;
border-radius: 2px;
}

*/




h3 { background:#4fb4cf; color:#fff; padding:10px 15px; font-size:22px; font-weight:500; margin:60px 0 30px;}
h3:before {font-family: "Font Awesome 5 Free"; content:'\f138'; font-weight:900; margin-right:10px;}
h3.first { margin-top:0 !important;}
h3 a { color:#fff; text-decoration:none;}
h3 a:hover { color:#fff;}






h4 {
     position: relative;
     padding-bottom: 0.5em;
     border-bottom: 4px solid #DDD;
 font-size:20px;
 font-weight:500;
 margin:50px 0 20px;
}
 
h4::after {
     position: absolute;
     content: " ";
     border-bottom: solid 4px #446689;
     border-bottom: solid 4px #234199;
     bottom: -4px;
     width:10%;
     display: block;
}





h5 {
     position: relative;
     padding-left: 1.2em;
 font-size:19px;
 font-weight:500;
 margin:40px 0 15px;
}
 
h5::after {
     position: absolute;
     top: 45%;
     left:0;
     transform:translateY(-50%);
     content: '';
     width: 15px;
     height:15px;
     border: solid 3px #234199;
     border-radius:100%;
}





/* btn */

.btn{
    display: inline-block;
    padding: 15px 50px;
    text-decoration: none;
    background: #668ad8;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 4px #627294;
    border-radius: 3px;
 font-size:18px;
 margin-top:30px;
 font-weight:bold;
}
/*ボタンを押したとき
.btn:active {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}
*/
.btn:hover { color:#fff; background:#1763ad;}
.btn-div { text-align:center;}
.button2 { background: #668ad8;/*ボタン色*/ border-bottom: solid 4px #627294;}
.button2:hover { background:#587cca;}






/* header */

#header { }
#h1 { float:left; width:540px;}
#h1 h1 { color:#666; margin-top:10px; }
#h-tel { float:right; margin-right:15px;}
#h-contact { float:right;}

#nav-wrap { border-top:1px #dddddd solid; border-bottom:1px #dddddd solid;}
#h-logo { padding:20px 0 9px; float:left;}

#gnav { float:right;}
#gmenu {}
#gmenu li { float:left; border-left:1px #ddd solid;  font-weight:bold; font-size:17px;}
#gmenu li a { display:block; padding:30px 35px; text-decoration:none;}
#gmenu li a:hover { background:url(/img/gm-bg.jpg) bottom left repeat-x;}
#gmenu li.gm5 { border-right:1px #ddd solid;}
#gmenu li a { color:#000;}

.pankuzu { border-bottom:1px #ddd solid; padding:10px 0; font-size:14px; }
.pankuzu a { color:#000;}





/* footer */

#footer { border-bottom:4px #234199 solid; padding-bottom:50px;}

#information { background:#f7f7f7; padding:10px 0 50px; margin-top:100px;}
	#information .info-title { font-size:30px; text-align:center; margin:30px 0 20px;}
	#information .fi-body { background:#fff; padding:35px 60px;}
	#information .fi-box { width:400px; }
	#information .fi-left { float:left;}
	#information .fi-right { float:right;}

	#information .fi-headline { background:#e5e5e5; padding:5px 10px; font-weight:600; }

	#information .fi-tel { font-size:34px; margin:0;}
		#information .fi-tel i { margin-right:15px;}
	#information .fi-tel-sub { margin:0 0 15px;}

.fnav { margin:30px 0;}
.fnav a { color:#000; }
.fnav li { float:left; }
.fnav li:after { content:"｜";}
.fnav li:last-child:after { content:"";}

.finfo { }
.finfo .f-logo { float:left;}
.finfo .info { float:right; text-align:right;}



/* sidebar */
#left-column { width:240px; float:left; }
.left-box { margin-bottom:30px;}
	.left-box p { margin:10px 0; }
	.left-box .title { color:#fff; background:#000; padding:7px 0 5px; text-align:center; font-size:18px; font-weight:500; }
	.left-box .body { border:1px #ceced0 solid; border-bottom-left-radius:5px; border-bottom-right-radius:5px; -webkit-border-bottom-left-radius:5px; -webkit-border-bottom-right-radius:5px; -moz-border-bottom-left-radius:5px; -moz-border-bottom-right-radius:5px; /* background:linear-gradient(#ffffff, #f4f4f4); */ padding:10px 20px; }
	.left-box .highlight { font-weight:600; text-align:center; color:red; background:yellow;}
	.left-box .lb-i { font-size:25px;}
	.left-box .lb-i a { color:#000; }
	.left-box .lb-i i { margin-right:10px;}

	.side-list li { border-bottom:1px #ddd solid; }
	.side-list li a { color:#000; padding:16px 30px; display:block; text-decoration:none; font-weight:600; background:url(/img/side-list-bg.jpg) no-repeat 15px center; line-height:1.3em;}
	.side-list li a:hover { background-color:#fafafa; transition: 0.5s;}
	/* .side-list li a:before { font-family: "Font Awesome 5 Free"; content:'\f0da'; font-weight:900; margin-right:10px;} */
	.side-list .cattitle { text-align:center; padding:5px; font-weight:600; background:#feffdf; }




/* archive */
.entry-box { text-align:right; font-size:12px;}
	.entry-box a { color:#000;}
.wp-pagenavi { margin-top:50px;}



/* index */

#top-sub-banner { }
	#top-sub-banner li { float:left; margin-right:24px;}
	#top-sub-banner li.last { float:right; margin-right:0;}

.news-list li { border-bottom:1px #ccc solid; padding:10px 0; clear:left;}
	.news-list li .date { float:left; margin-right:20px;}
	.news-list li .title { }

.feature { margin-top:30px;}
	.feature .ft-box { width:330px; }
	.feature .ft-box .point { background:#c3c3c3; color:#fff; width:34%; padding:2px 10px;}
	.feature .ft-box .title { background:#4fb4d0; color:#fff; font-size:17px; font-weight:600; padding:8px 15px; }
	.feature .ft-box .body { margin-top:10px; }
	.feature .ft-box .body img { float:left; margin:0 10px 10px 0; }

.feature .ftb-left { float:left;}
.feature .ftb-right { float:right;}



.top-banner { margin-top:80px;}






/* single */
.single-contents .date { text-align:right; margin:20px 0;}




/* page */

#mainsubimg { background:url(/img/mainsubimg-bg.jpg) no-repeat center center; background-size:cover; border-bottom:1px #dddddd solid;}
	#mainsubimg .parent-title { font-size:40px; padding:70px 0; font-weight:500;}


.company-table { width:100%; }
	.company-table th { width:30%;}
	.company-table th, .company-table td { border:1px #ddd solid; padding:10px 20px;}
	.company-table th { background:#feffe0;}

.page-contents ul { list-style-type:disc;}
	.page-contents ul li { margin-left:20px;}



/* flow */

.flow-title { background:#4fb4d0; width:100%; margin:0; padding:10px 20px; color:#fff; font-size:20px;}
.flow-body { border-left:2px #4fb4d0 solid; border-right:2px #4fb4d0 solid; border-bottom:2px #4fb4d0 solid; padding:20px; margin-bottom:40px;}
.flow-title span { color:#fff; background:pink; margin-right:20px; padding:5px 10px;}
.flow-title span.ft1 { background:#9fc81d;}
.flow-title span.ft2 { background:#489a28;}
.flow-title span.ft3 { background:#44a0a0;}
.flow-title span.ft4 { background:#38a4e9;}
.flow-title span.ft5 { background:#1f73b7;}
.flow-title span.ft6 { background:#061f7b;}
.flow-title span.ft7 { background:#a3397f;}
.flow-title span.ft8 { background:#ed4d82;}
.flow-title span.ft9 { background:#ed462f;}
.flow-title span.ft10 { background:#e58100;}


/* contact */
.hissu { font-size:12px; margin-left:5px; color:red;}
form input[type=text], form input[type=email], form input[type=password], form input[type=date], form select, form textarea { border: 1px solid #e5e5e5; border-radius: 4px; padding: 10px 5px; outline: 0; margin: 5px 5px 5px 0; -webkit-appearance: none; font-size: 100%; width:100%;}

.contact_button { text-align:center;}
input[type=submit] { width:150px; height:50px; margin:50px auto;}


.ct2 th, .ct2 td { display:block; width:100%; box-sizing:border-box;}




/* product */
.productlist { margin-bottom:100px;}
	.productlist .img { width:250px; float:left;}
	.productlist .body { width:430px; float:right;}


/* faq */

#QandA-3 {
    padding: 8px;
}
#QandA-3 h3 {
    color: #666;
    font-size: 18px;
    margin: 48px 0 16px 0;
    border-bottom: 1px dashed #ddd;
}
#QandA-3 dl {
    margin: 0 0 30px;
}
#QandA-3 dt,
#QandA-3 dd {
    position: relative;
    margin-left: 32px;
    background: #fafafa;
/*    border: 1px solid #ddd;*/
    border-radius: 4px;
    padding: 10px;
}
#QandA-3 dt {
    font-weight: bold;
    color: #111;
    margin-bottom: 8px;
}
#QandA-3 dd {
    line-height: 140%;
}
#QandA-3 dt:before,
#QandA-3 dd:before {
    display: inline-block;
    font-weight: bold;
    color: #fff;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
/*    border-radius: 50%;*/
    margin-right: 8px;
    position: absolute;
    left: -32px;

}
#QandA-3 dt:before {
    content: "Q";
    background: #c00000;
}
#QandA-3 dd:before {
    content: "A";
    background: #9890ff !important;
}








@media screen and (min-width:1000px) {

#nav-drawer { display:none;}

}




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


.inner { width:94% !important; margin:0 auto;}
#contents { width:100%; float:none; margin-left:0; margin-bottom:80px;}
#h1 { float:none; width:100%; display:none;}
#gnav { float:none;}
#h-contact { float:none; display:none;}
#h-tel { float:none; margin-right:0; display:none;}
#gmenu li { float:none; }
.finfo .f-logo { float:none; text-align:center;}
.finfo .info { float:none; text-align:center; margin-top:20px;}
#left-column { width:100%; float:none; }
.btn-div { clear:both;}
#top-sub-banner { text-align:center;}
#top-sub-banner li { float:none; display:inline-block; text-align:center; margin: 10px;}
#top-sub-banner li.last { float:none;  margin: 10px;}
#information .fi-left { float:none;}
#information .fi-box { width:100%;}
#information .fi-body { padding:20px;}

#mainsubimg .parent-title { text-align:center;}

.productlist .body { float:none; width:100%;}
.productlist .img { float:none; width:100%; text-align:center;}

.lb-contact { display:none;}

.slider { width:100%;}
.slider img { max-width:100% !important;}

h2.h2-1, #contents h2 { font-size:28px;}
h3 { font-size:20px;}
#mainsubimg .parent-title { font-size:34px; padding:40px 0;}

.company-table th, .company-table td { display:block; width:100%; box-sizing:border-box;}





#gnav { display:none;}
#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
position:absolute;
right:0;
top:20px;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #555;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 330px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

#gmenu-sp li { border-bottom:1px #ddd solid;}
#gmenu-sp li a { color:#000; display:block; padding:10px;}
#gmenu-sp li.title { color:#fff; background:#333; text-align:center; padding:15px 10px;}






}

@media screen and (min-width: 480px) and (max-width: 767px) { 

} 

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

.aligncenter,
div.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignleft {
   float: none;
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignright {
   float: none;
   display: block;
   margin-left: auto;
   margin-right: auto;
}

}

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

}