@charset "utf-8";
/* CSS Document */
/*
Theme Name: SONOSAKIORIGINAL
Description: オリジナルテーマ
Version: 1.1
Author: RYUJI KIRA
*/

@import url('https://fonts.googleapis.com/css?family=Lato:400,700|Noto+Sans+JP:400,700');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;500;700&display=swap');

/* CLEAR FIX */
.cf:after{content: "."; display: block; height: 0;  clear: both; visibility:hidden;}
.cf{display: inline-table;} 
/* Hides from IE Mac */
* html .cf{height: 1%;}
.cf{display:block;}
/* BOXSIZING */
.boxSizing { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}
/* iOSでのsubmitのスタイルをリセット */
input[type="submit"],input[type="button"] {border-radius: 0;-webkit-box-sizing: content-box;-webkit-appearance: button; appearance: button; border: none; box-sizing: border-box; cursor: pointer;}
input[type="submit"]::-webkit-search-decoration,input[type="button"]::-webkit-search-decoration {display: none;}
input[type="submit"]::focus,input[type="button"]::focus {outline-offset: -2px;}

/* =======PRUGIN SETTINGS======= */
/* PAGE TOP */
.pagetop {position: fixed;bottom: 10px;right: 10px;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0.3);-moz-transform: scale(0.3);-ms-transform: scale(0.3);-o-transform: scale(0.3);transform: scale(0.3);-webkit-transition: all .4s;-moz-transition: all .4s;	-o-transition: all .4s;	transition: all .4s;}
.pagetop a {display: block;width: 50px;	height: 50px;background-color: #d1d9e0;text-align: center;color: #000;font-size: 1em;text-decoration: none;line-height: 50px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%;}
.pagetop.show {	opacity: 1;filter: alpha(opacity=100);-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);}

/* BLOCK LINK */
.box-link{cursor:pointer;}
.box-link,
.box-link::before,
.box-link::after {-webkit-transition: all .3s;transition: all .3s;}
.box-link:hover{background:#f9f9f9;}

/* =======WP PAGENAVI SETTINGS======= */
.wp-pagenavi {clear: both; text-align: center; margin-top: 40px;}
.wp-pagenavi a, .wp-pagenavi span {text-decoration: none; display:inline-block;color:#444; background-color:#EEE; padding: 8px 15px; margin:0 1px; white-space: nowrap; -moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;-webkit-transition: 0.2s ease-in-out;-moz-transition: 0.2s ease-in-out;-o-transition: 0.2s ease-in-out;transition: 0.2s ease-in-out;}
.wp-pagenavi a:hover, .wp-pagenavi span.current {color:#FFF;background-color:#666;border-color:#666;}
.wp-pagenavi span.current {color:#FFF;background-color:#00caa1;border-color:#00caa1;font-weight: bold;}

/* =======WP CONTACT FORM7 SETTINGS======= */
.wpcf7 input,select,textarea{  border: none; padding:10px; margin:10px 0; background:#EEE;}
.wpcf7 p{margin-bottom:30px; }
.wpcf7-not-valid-tip{color:#ff92b7 !important; font-size:0.9em !important; }
.wpcf7-submit{text-align:center; color:#FFF;  width: 50%;  cursor: pointer;}
.wpcf7-validation-errors{border: 2px solid #EEE !important; font-size:0.9em !important; color:#ff92b7 !important;padding:10px !important;}
input.wpcf7-form-control.wpcf7-submit {padding: 20px; margin: 30px 0 0 0; background: #DB9489;}
span.wpcf7-quiz-label {margin-right: 30px;}

/* =======TABLE PRESS======= */
.tablepress{width: 100%; margin-bottom: 50px;}
.tablepress td {border: 1px solid #CCC; padding: 10px; background: #fff; box-sizing: border-box;}
/* .table-col1 */
td.column-1 {white-space: nowrap; width:20%;}

/* =======SLIDER======= */
.slick-slide {box-sizing: border-box;}
.slick-slider div { transition: none; }

/* =======アコーディオン======= */
.ac > li {padding-bottom: 6px; list-style: none;}
.ac-label  {cursor: pointer;  position: relative;}
.ac-content {display: none;}
.icon-wrap {position: absolute; right: 5px; top: 50%; transform: translatey(-50%); width: 38px; height: 38px;}
.icon {position: relative; display: inline-block;  width: 100%;  height: 100%;}
.icon:before,.icon:after {position: absolute; content: ""; display: block; transition: all 0.4s; background: #444; left: 50%; top: 50%; width: 50%; height: 2px; transform: translate(-50%, -50%);}
.icon:before {transform: translate(-50%, -50%) rotate(90deg);}
.icon.open:before {transform: translate(-50%, -50%) rotate(0deg);}

/* ======= BASIC ======= */
html,body { height: 100%; width: 100%; min-width: 1100px; }
body{font-family: Lato, 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color:#444; letter-spacing: 0.1em;}

img {max-width: 100%; height: auto;}
a{color:#444; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease; text-decoration:none;}
a:hover{color:#CCC;}
strong{font-weight:bold;}

/* OTHER-STYLING */
.big{font-size:1.4em;}
.small{font-size: 0.8em!important; margin-top:15px!important;}
.small a {color: #444!important;}

.arrow-down{ margin-bottom: 30px; font-size: 3em;}
.mb0{margin-bottom:0 !important;}
.mb10{margin-bottom:10px;}
.mb30{margin-bottom:30px;}
.mb50{margin-bottom:50px;}
.pc{display:inline;}
.sp {display: none;}
.menu-sp{display:none;}
.text-left{text-align:left;}
.text-right{text-align:right;}
.text-center{text-align:center;}

section.w1080{width:1080px; margin:0 auto;}
.jump{margin-top:-100px; padding-top:100px;}
.name {font-weight: bold; display: block; text-align: right; letter-spacing: 0; margin-top: 20px; font-size: 0.9rem;}
.youtube {position: relative; width: 100%; padding-top: 56.25%;}
.youtube iframe {position: absolute; top: 0; right: 0; width: 100%; height: 100%;}
.gcal {margin-bottom: 50px;}
.gcal iframe{width: 100%; height: 600px;}

/* ======= HEADER ======= */
header{ width:100%; z-index: 9900; position: fixed; top: 0;}
#header-box {background: #FFF;}
header h1 img {width: 100%; height: auto; padding-bottom: 15px;}
.header-inr {position: relative;}
.header-inr h1 {float: left; padding: 12px 0 0 35px;}
.headBox {float: right;}
.headNav {margin-right: 60px; margin-top: 30px;}
.headNav ul li {display: inline-block;}
.headNav ul li a {text-align: center; box-sizing:border-box; display: block; font-size: 1em; padding: 30px 10px 10px 10px; border-bottom:2px solid #FFF;}
.headNav ul li a:hover{box-sizing:border-box; border-bottom:2px solid #d1d9e0;}
.headNav ul li a span {display: block; font-size: 10px; color: #777;}

/* global nav */
#gnav {}
.nav-button-box {padding: 20px; z-index: 50; vertical-align: top; background: #FFF;}
.nav-button-box p {font-size: 0.5em;text-align: center; margin-top: 5px;}
.nav-button {display: block; cursor: pointer; }
.nav-wrap {position: fixed;left: 0;top: 0;  display:none; width: 100%; height: 100%;padding: 100px; box-sizing: border-box; background: rgba(255,255,255,0.9); z-index: 10; }
.nav-wrap a{text-decoration:none; padding: 5px 0; display: inline-block; color:#222; font-size:2em; line-height: 1.5em; font-weight: bold;}
.nav-wrap a:hover{font-size:1.2em; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease; }
.nav-wrap a span:hover{color:#FFF;}

ul.headbtn {float: left;}
ul.headbtn li {display: inline-block; }
ul.headbtn li a {text-decoration: none; letter-spacing: normal; font-weight: bold; padding: 25px 10px;}
ul.headbtn li.headLine a {background: #8bc34a; color: #FFF; padding: 26px; display: block; margin-left: 15px;}
ul.headbtn li.headLine a:hover{background: #CCC;}

/*メニューボタンのエフェクト*/
.nav-button span { display: inline-block; transition: all 0.4s; box-sizing: border-box;}
.nav-button { z-index: 20; position: relative; width: 40px; height: 36px;}
.nav-button span {position: absolute; left: 0; width: 100%; height: 4px; background-color: #2d2d2d; border-radius: 4px;}
.nav-button span:nth-of-type(1) {top: 0;}
.nav-button span:nth-of-type(2) {top: 16px;}
.nav-button span:nth-of-type(3) {bottom: 0;}

.nav-button.active span:nth-of-type(1) {
-webkit-transform: translateY(16px) rotate(-45deg);
transform: translateY(16px) rotate(-45deg);
}
.nav-button.active span:nth-of-type(2) {
opacity: 0;
}
.nav-button.active span:nth-of-type(3) {
-webkit-transform: translateY(-16px) rotate(45deg);
transform: translateY(-16px) rotate(45deg);
}

/* ======= FOOTER ======= */
footer{width:100%; text-align: center; color: #FFF; background: #DB9489;}
footer a{text-decoration:none; color: white;}

.footbox01 {text-align: center;}
.footbox01 ul {display: flex; justify-content: space-around; border-top: 1px solid #CCC;}
.footbox01 ul li {border-left: 1px solid #CCC; width: 16.666%;}
.footbox01 ul li:first-child {border-left: none;}
.footbox01 ul li a {display: block; padding: 20px; box-sizing: border-box; text-align: center; background: #EEE;}
.footbox01 ul li a:hover{background: #CCC; color: #FFF;}

.footbox02 { max-width: 1100px;  margin: 0 auto; padding: 80px 0; text-align: left;}
.footbox02 ul {display: flex;}
.footbox02 ul li img {width: 300px; height: auto; margin-right: 70px;}
.footbox02 ul li a {color: #FFF; margin-bottom: 10px; display: inline-block;font-size: xx-small;}
p.copyRight { font-size: 0.8em;letter-spacing: normal; text-align: center;}
span a .copy { font-size: 0.8em;letter-spacing: normal; text-align: center; color:white;}
/*  ======= TOP =======  */
/* TEASER */
#teaser {
  width: 100%;
  height: 700px;
  position: relative;
  margin: 0 0 80px 0;

  background-image: url("img/top/teaser.jpg");
  background-repeat: no-repeat;
  background-position: center 70%;
  background-size: cover;
}

.teaserBox {
  position: absolute;
  top: 80%;
  left: 70%;
  transform: translate(-50%, -50%);
  color: #989081;
  z-index: 9800;
  text-align: center;
}

.teaserBox h2 {
  font-size: 2rem;
  font-weight: normal;
}
#teaser {
  background-position: center 50%;
}
.teaserBox h2 {
  max-width: 520px;
  line-height: 1.7;
  letter-spacing: 0.08em;
}
.teaserBox h2 span {
  display: block;
}
.teaser-copy span {
  display: block;
  white-space: nowrap;
}
/* STAGE01 */
#stage01 {max-width: 1100px; margin: 0 auto; margin-bottom:80px; }
#stage01 h3 {font-size: 1.6rem; font-weight: bold; line-height: 2em; text-align: center;}

/* STAGE02 */
#stage02 {max-width: 1100px; margin: 0 auto;}
#stage02 ul li {text-align: center;}
#stage02 ul li a{padding: 0 50px 50px; display:block; box-shadow: 0 0 6px #CCC; box-sizing: border-box;}
#stage02 ul li a:hover{background:#F5F5F5; border-radius:0px;}
#stage02 ul li img {width: 60px; padding: 20px 0;}
#stage02 p span {display: block; font-size: 0.9rem; color: #666; margin-top: 10px;}
#stage02 p {color: #989081; font-size: 1.3em; padding-top: 10px;}

/* STAGE03 */

#stage03 {box-sizing: border-box; padding: 80px 0; text-align: center; background: #EEE;}
#stage03 a {text-decoration: none;}
.stage01Box {width: 1100px; text-align: left; margin: 0 auto; background: #FFF; padding: 50px; box-sizing: border-box;}
ul.stage01Title {margin-bottom: 40px;}
ul.stage01Title li:nth-child(2) {text-align: right; margin-top: -40px;}
ul.stage01Title li a{color:#2d2d2d;}
.stage01Postt ul li {border-bottom: 1px solid #CCC; }
.stage01Postt ul li a{display:block;padding: 20px 0; }
#stage03 h2 {font-size: 1.8rem;
    position: relative;
    padding-bottom: 30px;
    margin-bottom: 30px;
	 letter-spacing: 0.2rem;}

/* ======= PAGES ======= */
#container {margin-bottom: 100px;}

.page-title {width: 100%; padding-top: 120px; position: relative; background: #EEE; text-align: center;}
.page-title h2 {padding: 100px 0; font-size: 2.8em; font-weight: bold; color: #FFF; text-shadow: 0 0 5px #333;}
.page-title h2 span {display: block; font-size: 1rem; font-weight: normal; margin-top: 10px;}

.compayTitle{background: url("img/title/bkg.jpg")no-repeat center; background-size: cover;}
.contactTitle{background: url("img/title/bkg.jpg")no-repeat center; background-size: cover;}
.recruitTitle{background: url("img/title/bkg.jpg")no-repeat center; background-size: cover;}
.serviceTitle{background: url("img/title/bkg.jpg")no-repeat center; background-size: cover;}
.newsPageTitle{background: url("img/title/bkg.jpg")no-repeat center; background-size: cover;}
.sonosakiAc{background: url("img/title/bkg.jpg")no-repeat center; background-size: cover;}
.breadCrumb {background: #EEE; padding: 10px 0; font-size: 0.8rem; letter-spacing: normal; margin-bottom: 70px;}

.page h3 {font-size: 1.8rem; position: relative;  padding-bottom: 30px; margin-bottom: 30px; letter-spacing: 0.2rem; color:#999182;}
.page h3 span {display: inline-block; font-size: 1rem; font-weight: bold; color: #CCC; margin-left: 30px;}
.page h3:before {content: ""; display: block; width: 100%; border-bottom: solid 3px #EEE; position: absolute; bottom: 0; left:0; }
.page h3:after {position: absolute; content: " "; display: block; border-top: solid 3px #999182; bottom: 0; left:0; width: 10%;}
.page h4 {position: relative; font-size: 1.4rem; font-weight: bold; margin-bottom: 30px;}
.page h5 {font-size: 1.2rem; font-weight: bold;  margin-bottom: 20px; }
.page h5 span {font-size: 0.8rem;font-weight: normal;}
.page h6 {font-size: 1rem; font-weight: bold; margin-bottom: 10px;}
.page p {text-align: justify; line-height: 1.5em; letter-spacing: 0.1em; margin-bottom: 30px;}
.page p a {color: #63abbd; text-decoration: underline;}

.pageMidashi {max-width: 1100px; margin: 0 auto; margin-bottom:80px; }
.pageMidashi p {font-size: 1.6rem; font-weight: bold; line-height: 2em; text-align: center;}
.pageMidashi span {font-size: 1rem;}

.baseBox {margin-bottom: 50px;}
.reverse {display: flex; flex-direction: row-reverse;}

table.basic-table th {white-space: nowrap; padding: 10px 20px; border: 1px solid #CCC; background: #EEE;}
table.basic-table {font-size: 0.9em; width: 100%; line-height: 2.0em; margin-bottom:50px;}
table.basic-table td {border: 1px solid #CCC; padding: 10px 20px;}
table.no-line {width: 100%;}
table.line {font-size: 0.9em; width: 100%; line-height: 2.0em; margin-bottom: 30px;}
table.line th {white-space: nowrap; padding: 10px 20px; border-bottom: 1px solid #CCC;}
table.line td {border-bottom: 1px solid #CCC; padding: 10px 20px;}

a.baseBtn {position: relative; text-align: center; text-decoration: none; display: block; background: #1760a0;; color: #FFF;  padding: 20px; }
a.baseBtn:hover{ background: #EEE; color: #222;}
a.baseBtn i {position: absolute; right: 10px;}

ul.col2{display: flex; justify-content: space-between;flex-wrap: wrap;}
ul.col2 li{width:48%;}
ul.col3{display: flex; justify-content: space-between;flex-wrap: wrap;}
ul.col3 li{width:32%;}
ul.col4 {width: 100%; display: flex; justify-content: space-between;flex-wrap: wrap; margin-bottom: 80px;}
ul.col4 li{width:23.33333%;}
ul.col5 {width: 100%; display: flex; justify-content: space-between;flex-wrap: wrap;}
ul.col5 li{width:18%;}

/**** ABOUT ****/
.about01 {margin-bottom: 70px;}
.about02 {margin-bottom: 70px;}
.about03 ul {display: flex; width: 100%; box-shadow: 0 0 5px #CCC; margin-bottom: 70px;}
.about03 ul li {  width: 50%;}
.about03 ul li:nth-child(2) {padding: 50px; box-sizing: border-box; position: relative;}
.about03 ul li:nth-child(2) p {font-size: 1.2rem; font-weight: bold;}
.about03 ul li:nth-child(2) img {width: 250px; position: absolute; bottom: 50px; right: 200px;}
.about03 p span {font-weight: bold;}

p.migi img {width: 20%;}
.page p.migi {text-align: right;}
.value-list li {
  margin-bottom: 0.5em;
  line-height: 1.6;
}

.value-list .en {
  font-weight: 700;     /* 英語部分を太字 */
  font-size: 1.4rem;    /* 英語部分を大きく */
  display: inline-block;
}

.value-list .jp {
  font-weight: 400;     /* 日本語部分は通常 */
  font-size: 1rem;      /* 必要なら調整 */
}

/**** SERVICE ****/
.servicePage ul {margin-bottom: 70px;}
.servicePage h3 {font-weight: bold;}
.servicePage h3 span { margin-left: 10px; color: #444; letter-spacing: normal;}
.servicePage a:hover {background: #CCC; color: #222;}
.servicePage a i {position: absolute; right: 20px; bottom: 24px;}
.servicePage a {background: #C3C1B6; color: #FFF; padding: 20px; box-sizing: border-box; display: block; text-align: center; position: relative; margin-bottom: 10px;}
/**** SERVICE ****/
section.mainWide {width: 1100px; margin: 0 auto;}
.ser01 ul li a{display: flex; background: #333; color: #FFF; align-items: center; position: relative;}
.ser01 ul li a:hover{background: #CCC;}
.ser01 ul li a img {width: 50%;}
.ser01 ul li i {border-radius: 50px; border: 1px solid #EEE; font-size: 13px; line-height: 18px; position: absolute; right: 22px; top: 47%;}
.ser01 ul li a p {font-size: 20px; font-weight: bold; margin-left: 30px;}

/**** RECRUIT ****/
.ac-label {cursor: pointer; position: relative; background: #EEE; padding: 20px;}
.ac-label p {margin: 0; font-weight: bold;}
.ac-content {padding: 50px; box-sizing: border-box;}
.ac-content a:hover {background: #CCC; color: #222;}
.ac-content a i {position: absolute; right: 20px; bottom: 24px;}
.ac-content a {background: #2d2d2d; color: #FFF; padding: 20px; box-sizing: border-box; display: block; text-align: center; position: relative;}

/**** PRIVACY ****/
p.syomei {text-align: right;}

/**** OPSAC ****/
.opsAc01 {margin-bottom: 70px;}
.opsAc02 {margin-bottom: 70px;}
.opsAc03 table {margin-bottom: 10px;}
.opsAc03 ul {margin-bottom: 50px;}
a.linkBtn {background: #183f76; color: #FFF; padding: 20px; box-sizing: border-box; display: block; width:50%; margin:0 auto; text-align: center;  position: relative;}
a.linkBtn:hover {background: #CCC; color: #222;}
a.linkBtn i {position: absolute; right: 20px; bottom: 24px;}

/**** CONTACT ****/
.contactPage table {font-size: 0.9em; width: 100%; line-height: 2.0em; margin-bottom: 30px;}
.contactPage table th {white-space: nowrap; padding: 10px 20px; border-bottom: 1px solid #CCC;}
.contactPage table th span{background: #63abbd; padding: 5px 10px; font-size:10px; color: #FFF; border-radius: 5px; margin-right: 10px;}
.contactPage table th span.nini {background: #BBB;}
.contactPage table td {border-bottom: 1px solid #CCC; padding: 10px 20px;}

nput.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {width: 100%;}
textarea.wpcf7-form-control.wpcf7-textarea.wpcf7-validates-as-required {width: 100%;}
input.wpcf7-form-control.wpcf7-text {width: 100%;}
.submitArea {margin-top: 60px;}
.submitArea p {text-align: center;}
.submitArea p span {display: block; margin: 0 auto;}
.grecaptcha-badge { visibility: hidden; }

/**** THANKS ****/
.thanksPage p {text-align: center;   font-size: 1.5em;}
.thanksPage h4 {border: none; text-align: center; border: 4px solid #2d2d2d; color: #2d2d2d; padding: 30px 0; width: 50%; margin: 0 auto 50px; text-indent: 0;}


/* ======= CATEGORY ======= */
/* ======= SINGLE PAGE ======= */
/* ======= CATEGORY ======= */
.catWrap {display: flex; justify-content: space-between;margin-top: 100px; margin-bottom: 100px;}
.catpage h3 {font-family: 'Noto Sans JP'; font-size: 1em; margin-bottom: 0;  padding: 10px 0; border-bottom: 1px solid #EEE; font-weight: bold;}
.catNews a {display: flex; align-items: center;  border-bottom: 1px solid #EEE;}
.catNews a p {margin-right: 15px;}

#leftBox {width: 70%;}
#leftBox h3 {border-bottom: none;}

#rightBox {width: 25%;}
#rightBox h3 {margin-bottom: 15px;}
.postCat {margin-bottom: 30px;}

.selectbox-002 {position: relative;}
.selectbox-002::before,
.selectbox-002::after {position: absolute; content: ''; pointer-events: none;}
.selectbox-002::before {right: 0; display: inline-block; width: 2.8em; height: 2.8em; border-radius: 0 3px 3px 0; background-color: #a8a8a8; content: '';}
.selectbox-002::after {position: absolute; top: 50%; right: 1.4em; transform: translate(50%, -50%) rotate(45deg); width: 6px; height: 6px; border-bottom: 3px solid #fff; border-right: 3px solid #fff; content: '';}
.selectbox-002 select {appearance: none; -webkit-appearance: none; -moz-appearance: none; min-width: 230px; height: 2.8em; padding: .4em 3.6em .4em .8em; border: 2px solid #a8a8a8; border-radius: 3px; color: #333333; font-size: 1em; cursor: pointer;}
.selectbox-002 select:focus {outline: 1px solid #a8a8a8;}

/* ======= SINGLE PAGE ======= */
#leftBox h3.single-title {border-bottom: 1px solid #EEE; font-family: 'Noto Serif JP'; padding: 0 0 10px; font-size: 1.6em; display: flex; align-items: center; margin-bottom: 50px; font-weight: normal;}
#leftBox h3.single-title span{font-size: 0.5em; margin-right: 15px;}

.cat_paging {width: 100%; position: relative; overflow: hidden; text-align: center;}
.cat_paging p {margin-bottom: 20px;}
.cat_paging a {border: 1px solid #EEE; display: block; padding: 15px 0; border-radius: 5px;  font-family: nNoto sans-serif;  font-size: 0.9em;}
.cat-back {border-top: 1px solid #EEE; padding: 50px 0; margin-top: 50px; }

.alignLeft {float: right; width: 30%;}
.alignCenter {position: absolute; width: 30%; left: 35%;}
.alignRight {float: left; width: 30%;}

/* 投稿エリアの設定 */
#editor-area a{color:#2196F3; }
#editor-area a:hover{color:#EEEEEE;}
#editor-area img{max-width: 100%; height:auto; display:block;}
#editor-area h4{border-left: 3px solid #2d2d2d; font-size: 1.2em; padding-left: 20px; margin-bottom: 20px;}
#editor-area h5 {font-weight: bold; color: #2d2d2d; font-size: 1.2em; margin-bottom: 10px;}
#editor-area h6{font-weight: bold; font-size: 1em; padding-bottom:10px; margin-bottom:10px; color:#333; }
#editor-area p{margin-bottom:30px; line-height: 1.8em;}
#editor-area strong{font-weight:bold;}
#editor-area ul{margin: 30px 0 30px 5px;}
#editor-area ul li{margin: 2px 0 2px 15px;  list-style: disc;}
#editor-area table{ width: 100%; border-collapse: collapse; margin-bottom:30px;}
#editor-area table th{padding: 10px; background-color: #eee; border: 1px solid #CCC;}
#editor-area table td { padding: 10px; border: 1px solid #EEE;}
#editor-area blockquote{padding: 20px; margin-bottom:30px; background:#EEEEEE;}
#editor-area blockquote p{margin:0px !important;}
#editor-area div.borderbox{border:1px dotted #CCC; padding: 20px; margin-bottom:30px;}
#editor-area div.borderbox p{margin:0px !important;}
#editor-area div.borderbox ul{margin:0px !important;}

#editor-area iframe::before { content: "<div>";}
#editor-area iframe::after { content: "</div>";}


/* 投稿エリアの設定 */
#editor-area a{color:#444;}
#editor-area a:hover{background:#EEEEEE;}
#editor-area img{max-width: 100%; height:auto; display:block;}
#editor-area h4{position: relative; font-size: 1.5rem; font-weight: bold; padding-bottom: 10px; margin-bottom: 30px;}
#editor-area h5{font-size: 1.2em; padding-bottom:10px; margin-bottom:10px; font-weight: bold; }
#editor-area p{margin-bottom:30px; line-height: 1.8em;}
#editor-area ul{margin: 30px 0 30px 5px;}
#editor-area ul li{margin: 2px 0 2px 15px;  list-style: disc;}
#editor-area table{ width: 100%; border-collapse: collapse; margin-bottom:30px;}
#editor-area table th{padding: 10px; background-color: #eee; border: 1px solid #CCC;}
#editor-area table td { padding: 10px; border: 1px solid #EEE;}
#editor-area blockquote{padding: 20px; margin-bottom:30px; background:#EEEEEE;}
#editor-area blockquote p{margin:0px !important;}
#editor-area div.borderbox{border:1px dotted #CCC; padding: 20px; margin-bottom:30px;}
#editor-area div.borderbox p{margin:0px !important;}
#editor-area div.borderbox ul{margin:0px !important;}
#editor-area .aligncenter {margin: 0 auto;}

#editor-area iframe::before { content: "<div>";}
#editor-area iframe::after { content: "</div>";}


@media screen and (max-width: 1279px) {
 /*　================================ for ipad ================================　*/

}
@media screen and (max-width: 480px) {
 /*　================================ for iphone ================================　*/

/* HEAD */
html,body { height: 100%; width: 100%; min-width: 100%; font-size: 14px;}
section.w1080 {width:90%; margin: 0 auto;}
.pagetop{display:none!important;}
	
.sp{display:inline;}
.pc{display:none!important;}
.mb50 {margin-bottom: 20px;}
.mt50 {margin-top: 50px;}
.button {padding: .9em 30%;}

.s04Btn {width: 80%;}
.btnline {width: 50px;}

/* header */
#header-box {border-top: none;}
#header-box h1 img {width: 185px; height: auto;}
.header-inr {background: #FFF; box-shadow: none; border-bottom: 1px solid #CCC;}
.header-inr h1 {padding: 15px 0 0 15px;}
.nav-wrap {padding: 80px 10px; font-size: 0.8em;}
.nav-wrap a { padding: 10px; color: #2d2d2d; line-height: 1em; display: block; text-align: center;}
.nav-wrap a span {display: block; font-size: 0.5em;}
.nav-button-box.sp {display: block; margin-top: 10px;}
.teaserBox {position: absolute; color: #FFF; bottom: 200px; right: 50px; z-index: 9800;}
/* footer */
footer {padding: 0;}
footer p {margin-bottom:0; letter-spacing: 0;}
footer section.w1080 {width: 100%;}
.footbox01 ul {display: flex; border-top: 1px solid #CCC; flex-direction: column; align-items: center;}
.footbox01 ul li:first-child {border-left: none;}
.footbox01 ul li {border-left: 1px solid #CCC; width: 100%; border-bottom: 1px solid #CCC; border-left: none;}
.footbox02 {padding: 50px 0; text-align: center;}
.footbox02 ul {display: flex; flex-direction: column;}
.footbox02 ul li img {width: 250px; height: auto; margin-right: 0; margin-bottom: 40px;}
p.copyRight { padding: 30px;}

/* 共通 */
#container{width:100%; margin-bottom: 50px; padding:0;}
#container.toppage {margin-bottom: 0;}
table.base th {white-space: nowrap; padding: 10px; border: none; display: block; border-bottom: 1px solid #CCC; background: #F5F5F5;}
table.base td {border: none; border-bottom: 1px solid #CCC; padding: 10px 0; display: block; box-sizing: border-box;}

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

  #teaser {
    height: calc(100vh - 90px);
    margin: 0 auto 40px;
    background-position: center 45%;
    overflow-x: hidden;
  }

  .teaserBox {
    top: 80%;
    left: 58%;
    transform: translateX(-50%);
    width: calc(100% - 48px);
    box-sizing: border-box;
  }

  .teaserBox h2 {
    font-size: 1.4rem;
    line-height: 1.7;
    letter-spacing: 0.04em;
	  color:#989081;
  }

  .teaserBox h2 br {
    display: inline;
  }
}

/* STAGE01 */
#stage01 {margin-bottom: 0;}
#stage01 h3 {font-size: 1.2em; margin-bottom: 30px;}

/* STAGE02 */
#stage02 {margin-bottom: 0;}
#stage02 ul li a {padding: 0 20px 30px;}
#stage02 ul li img {width: 50px; padding: 20px 0;}
#stage02 p {color: #2d2d2d; font-size: 1.1em;}
#stage02 p span { margin-top: 0;}
.stage02Box {padding: 5%;}
.stage02Box ul.col4 li {width: 47%;}
/* STAGE03 */
#stage03 {padding: 30px 0;}
.stage01Box {width: 90%; padding: 30px;}
#stage03 h2 {font-size: 1.5em;}
ul.stage01Title {margin-bottom: 20px;}
ul.stage01Title li:nth-child(2) {margin-top: -24px; font-size: 0.8em;}
.stage01Postt span {display: block;}
.stage01Postt ul li:last-child{border:none;}
/* =====PAGE===== */
#contents-page {width: 100%; margin: 0 auto;}
.page-title {padding-top: 68px;}
.page-title h2 {display: block; font-size: 2em; padding: 30px 0; text-align: center;}
.page-title h2 span {margin-left: 0; font-size: 0.8rem; padding-bottom: 0; display: block;}

.breadCrumb {margin-bottom: 30px;}
.baseBox {margin-bottom: 30px;}
.baseBox p:last-child {margin-bottom: 0;}

ul.col2 li{width: 100%; margin-bottom: 20px;}
ul.col2 li:nth-child(odd){margin-right: 0; margin-bottom: 20px;}
ul.col2 li:last-child{margin-bottom:0;}
ul.col3 li{width: 100%; margin-bottom: 20px;}
ul.col3 li:nth-child(3n-1){margin:0 0 20px 0;}
ul.col4 li{width:100%; margin:0 0 20px;}
ul.col4 li:nth-child(4n+1){margin:0 0 20px 0;}

.page h3 { 
  font-size: 1.5rem;
  margin-bottom: 20px;
  letter-spacing: normal;
}
.page h5 span {font-size: 0.8rem; margin-left: 0; display: block;}

.pageMidashi {width: 90%; margin-bottom: 30px;}
.pageMidashi p {font-size: 1.1rem; line-height: 1.6em;}

table.line th {display: block; background: #F5F5F5;}
table.line td {display: block;}

a.linkBtn {width: 100%;}

/* ABOUT */
.about01 {margin-bottom: 50px;}
.about02 { margin-bottom: 50px;}
.about02 h4 {font-size: 1.2em;}
.about03 ul {display: flex; flex-direction: column; margin-bottom: 30px;}
.about03 ul li {width: 100%;}
.about03 ul li:nth-child(2) {padding: 20px;}
.about03 ul li:nth-child(2) img {width: 170px; position: relative; bottom: unset; right: unset; text-align: right; float: right;}
p.migi img {width: 40%;}
/* SERVICES */
.servicePage ul {margin-bottom: 30px;}
.servicePage ul:nth-child(2) {display: flex; flex-direction: column-reverse;}
.servicePage ul:nth-child(4) {display: flex; flex-direction: column-reverse;}
.servicePage ul:nth-child(2) li:nth-child(odd) {margin-bottom: 0;margin-top: 20px;}
.servicePage ul:nth-child(4) li:nth-child(odd) {margin-bottom: 0;margin-top: 20px;}
/* SERVICE */
.ser01 ul li a p {font-size: 14px; font-weight: bold; margin-left: 15px;}
.myhr01 h3 span {font-size: 19px;}
.myhr01 h3 {font-size: 100px;}
.myhr02 {padding-top: 20px;}
.myhr02 ul li {margin-bottom: 14px!important; font-size: 12px;}
.myhr03 img {width: 300px;  margin-bottom: 27px;}
.whiteBox {padding: 50px 25px 0; margin-bottom: 30px;}
.myhr04 h4 {font-size: 18px; margin-bottom: 30px;}
.myhr04 ul {margin-bottom: 0 !important;}
.myhr04 ul li span {margin-bottom: 10px;}
.cardBox {padding: 5%;}
.myhr04 ul li p { font-size: 14px;}
.myhr05 .whiteBox { margin-top: 0;  margin-bottom:30px;  padding: 5%;}
.myhr05 .whiteBox p {font-size: 14px;}
img.thanks {display: none;}
.gaibu01 h3 {font-size: 44px;}
.gaibu01 h3 span {font-size: 19px;}
.gaibu02 ul li {margin-bottom: 14px!important; font-size: 12px;}
/* RECRUIT */
.ac-content {padding: 5%;}

/* CONTACT */
.contactPage table th {display: block; background: #F5F5F5;}
.contactPage table td {display: block; padding: 10px 0;}
.submitArea {margin-top: 30px;}
input.wpcf7-form-control.wpcf7-submit {margin: 0 0 0 0;}
.wpcf7-submit {width: 100%;}

.thanksPage h4 {width: 100%; margin: 0 auto 30px;}
.thanksPage p {text-align: justify; font-size: 1em;}

/* OPSAC */
.opsAc01 {margin-bottom: 0;}
.opsAc02 {margin-bottom: 0;}
.opsAc03 p {font-size: 0.9rem;}
.opsAc03 ul {margin-bottom: 0;}


/* =======CATEGORY======= */
.blogLeft {float: none; width: 100%;}
.blogRight {float: none; width: 100%;}
.cat-sidebox ul li {display: block; margin: 0; width: 100%; box-sizing: border-box;}
.cat-sidebox ul li a { padding: 15px 0; display: block;}

.cat-sidebox ul li:first-child a {padding-top: 0;}
.cat-sidebox ul li:last-child {border: none;}
.cat-sidebox .tag a {padding: 15px; border-radius: 25px; display: inline-block;}
.cat-sidebox h4 {margin-bottom: 30px;}

.newsPage p {padding: 15px 0;}
.newsPage {margin-bottom: 50px;}

/* =======POST AREA======= */
.cat-postbox h3 span {display: block; font-size: 0.8em; margin-bottom: 10px;}
.cat-postbox { padding: 10px 0;}
.cat-postbox li { padding: 20px 0; font-size: 0.9em;}
.cat-nav li {margin: 5px 5px; font-size: 0.8em;}

.single-postbox {padding: 0;  margin-bottom: 30px;}


.cat_paging a {padding: 20px 5px; font-size: 12px; letter-spacing: normal; border: 1px solid #666;}
.cat-back {}

.tag-title {margin-bottom: 30px;}
.tag-title h3 {margin-top: 30px; margin-bottom: 30px; font-size: 1.5em;}
.morePost ul li {width: 32%;}

/* =======EDITOR AREA======= */
#editor-area p {font-size: 0.9em;}
#editor-area h4 {font-size: 1em !important; margin-bottom: 25px !important; }
#editor-area h5 {font-size: 1em; margin-bottom: 10px;}
#editor-area table {border: 1px solid #CCC;border-bottom: none;}
#editor-area table td {display: block; width: 100%!important; box-sizing: border-box; border: none; border-bottom: 1px solid #CCC;}

/* =======WP CONTACT FORM7 SETTINGS======= */
.wpcf7 select,textarea{padding:5%; width:100%; box-sizing: border-box;}
.table-entry table td {display: block; border: none;}
.table-entry table {border: 1px solid #CCC;}
.table-entry table th {border: none;}
input.wpcf7-form-control.wpcf7-text {padding:5%; width: 100%; box-sizing: border-box;}
input.w30 { width: 20%!important;}
span.wpcf7-quiz-label {margin-right:0;display:block;}
.wp-pagenavi {margin-top: 0; margin-bottom: 50px;}

td.column-1 { width: 100%; background: #F5F5F5;  border-bottom: 1px solid #CCC;}
.tablepress td {border: none; width: 100%;display:block;  }
/* reCAPTCHA 表示を控えめに */
.grecaptcha-badge,
.wpcf7-recaptcha {
  font-size: 11px;
  color: #999;
  margin-top: 20px;
}