@charset "utf-8";

.flexbox {
   display:flex;
}

#intro{
  margin: 0 0 20px 0;
}

#intro figure{
  margin: 0 0 15px 0;
}

.tabs{
  display: none;
}

table th,
table td{
  font-size: 20px;
}

table td ul,
table td ul li{
    list-style-type: none !important;
}

fieldset {
    display: block;
    min-inline-size: min-content;
    margin-inline: 0;
    border-width:  0;
    border-style: unset;
    border-color: unset;
    border-image: unset;
    padding-block: 0;
    padding-inline: 0;
}


#g_navi ul li.pc_hide,
.pc_hide{
display: none;
}
.pc_show {
display: block;
}

* {
	padding: 0;
	margin: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}



html {
  height: 100%;
}

body {
	color: #111;
	background-color: #F2F6F7;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	word-wrap: break-word;
	height: 100%;
	line-height: 2.2;
}
/*-----ast-----*/

/*-----as outline-----*/
.table {
  border-collapse: collapse;
  width: 100%;
}
.table th, .table td {
  border: 2px solid #fff;
  background-color: #f7f9f9;
  border-radius: 0 15px 15px 0;
  padding: 1em;
}
.table th {
  background-color: #4d9bc1;
  color: #fff;
  font-weight: bold;
  text-align: center;
  border-radius: 10px 0 0 10px;
  width: 20%;
  min-width: 4em;
  position: relative;
}
.table th::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
  border: 10px solid transparent;
  border-left: 10px solid #4d9bc1;
  z-index: 2;
}
.table th::after {
  content: '';
  position: absolute;
  top: 50%;
  left: calc(100% + 2px);
  transform: translateY(-50%);
  border: 12px solid transparent;
  border-left: 12px solid #fff;
  z-index: 1;
}





/*-----as corpinfo-----*/
.topv {
    background: #fff;
    padding: 100px 0 0 0;
}
.topv .piece .flexbox {
  position: relative;
}
.topv .piece .flexbox .txt{
position: absolute;
    width: 50%;
    background: #fff;
    border-right: 5px solid #C59F5E;
    border-bottom: 5px solid #C59F5E;
    z-index: 1000;
    padding: 25px;
}
.topv .piece .flexbox .img {
    text-align: right;
    width: 75%;
    margin: 0 0 0 auto;
}

.topv .piece .flexbox .img img{
    width: 100%;
}

.font_mincho {
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

#conpanyArea p.btn,
#reasonArea p.btn {
  margin: 20px 0 0 0px;
  text-align: center;
  font-size: 150%;
  line-height: 1;
}

#conpanyArea p.btn a,
#reasonArea p.btn a {
  background-color: #ff7f00;
  color: #fff;
  display: block;
  padding: 20px;
  text-decoration: none;
}

#conpanyArea p.btn a:before,
#reasonArea p.btn a:before {
    font-family: "Font Awesome 5 Free";
    content: '\f531';
    color: #fff;
    float: right;
    font-size: 70%;
    margin: 4px 0 0 0;
}

#conpanyArea p.btn:hover,
#reasonArea p.btn a:hover {
  opacity: 0.8;
}

#reasonArea , 
#conpanyArea {
  margin: 0 0 50px 0;
}


#newslist h2,
#ulResult h2,
.topv .txt p.ttl, 
#reasonArea h2, 
#conpanyArea h2,
.baskervville {
  font-family: "Baskervville", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 48px;
  color:#284780;
  line-height: 1.2;
  margin: 0 0 20px 0;
}

#newslist h2:first-letter,
#ulResult h2:first-letter,
.topv .txt p.ttl:first-letter,
#reasonArea h2:first-letter, 
#conpanyArea h2:first-letter{
  color:#9C8133;
}

.topv .txt p.ttl{
text-align: center;
}

.topv .txt p.ttl span{
  display: block;
  font-size:24px;
}
.topv .txt p.con{
  font-size:20px;
}

.content #reasonArea h3, 
.content #conpanyArea h3{
    font-size: 38px;
    font-family: "Sawarabi Gothic";
    line-height: 1.2;
    margin: 0 0 20px 0;
    padding: 0;
    font-weight: bold;
    color: #284780;
}
.content #reasonArea h3:after, 
.content #conpanyArea h3:after {
    display: unset;
    width: unset;
    height: unset;
    position: unset;
    top: unset;
    left: unset;
    background-color: #unset;
    content: unset';
}

#conpanyArea .img img,
#reasonArea .img img{
  width: 100%;
  height: auto;
}

#conpanyArea h2{
  text-align: right;
}
#conpanyArea .txt{
width: 60%;
}
#conpanyArea .img{
width: 40%;
margin: 0 0 0 5%;
}
#reasonArea h2{
  text-align: left;
}
#reasonArea .txt{
width: 60%;
}
#reasonArea .img{
width: 40%;
margin: 0 5% 0 0;
}

#works{
    background-image: url(/_themes/base/img/img_haikei.webp);
    background-size: cover;
    background-repeat: no-repeat;
}
#works #worksNavi{
background-color: rgba(40, 71, 128, 0.8);
margin: 0 0 40px 0;
}

#works #worksNavi h2{
  font-family: "Baskervville", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 90px;
  color:#fff;
  line-height: 0.7;
  margin: 0 0 20px 0;
}
#works #worksNavi h2:first-letter{
  color:#9C8133;
}
.content #works #worksNavi dd a,
.content #works #worksNavi dt a,
#works #worksNavi h3 a{
  color: #fff;
  text-decoration: none;
}

.content #works #worksNavi dd a:hover,
.content #works #worksNavi dt a:hover,
#works #worksNavi h3 a:hover{
  text-decoration: underline;
}

.content #works #worksNavi dd  #searchResult dt{
display: flex;
}

.content #works #worksNavi .keyword h3{
display: none;
}

.content #works #worksNavi dd  #searchResult form{
display: flex;
}

.content #works #worksNavi dd  #searchResult .keyword label{
  display: none;
}
.content #works #worksNavi dd  #searchResult .keyword input{
  width: 100%;
  font-size: 26px;
}


#works #worksNavi h2 span{
  color:#fff;
  font-family: "Baskervville", serif;
  font-size: 48px;
}

#works #worksNavi p{
  color:#fff;
}
.content #works #worksNavi h3{
    font-size: 22px;
    font-family: "Sawarabi Gothic";
    line-height: 1.2;
    margin: 0 0 10px 0;
    padding: 0;
    font-weight: bold;
    color: #fff;
}

.content #works #worksNavi h3:after {
    display: unset;
    width: unset;
    height: unset;
    position: unset;
    top: unset;
    left: unset;
    background-color: #unset;
    content: unset';
}

.leftAre,
.rightArea{
    width: 48%;
    padding: 2% 0px;
    box-sizing: border-box;
}
.rightArea{
    padding: 2%;
}

.leftAre ul {
  flex-wrap: wrap;
  justify-content: space-between;
}

.leftAre ul li {
  flex-basis: calc(49.8% - 6px);
  margin: 0 0 12px 0;
  font-size: 20px;
  font-weight: bold;
}

.leftAre ul li a{
  color: #fff;
}

.leftAre ul li img{
  width: 100%;
  height: auto;
}
.leftAre ul li figure{
  position: relative;
}
.leftAre ul li figure figcaption{
    position: absolute;
    bottom: 0;
    display: block;
    padding: 5px;
    background-color: 
    color-mix(in srgb, #9C8133 80%, transparent);
    width: 100%;
    text-align: center;
}

.content #works #worksNavi dt{
    font-size: 20px;
    font-family: "Sawarabi Gothic";
    color: #fff;
    font-weight: bold;
}

.content #works #worksNavi dd h2{
  display: none;
}



.content #works #worksNavi dd{
    font-size: 20px;
    font-family: "Sawarabi Gothic";
    color: #fff;
    margin: 0 0 40px 0;
}

.content #works #worksNavi dd a{
    color: #fff;
}

.content #works #worksNavi dd .submitters input {
    background-color: rgb(255, 255, 255);
    color: rgb(40, 71, 128);
    font-size: 20px;
    cursor: pointer;
    padding: 4px 30px;
    border-width: initial;
    border-style: none;
    border-color: initial;
    border-image: initial;
    margin: 0 0 0 20px;
}
.content #works #worksNavi dd .submitters input:hover {
    background-color: rgb(40, 71, 128);
    color: rgb(255, 255, 255);
}


.subArea .keyword label{
  display: none;
}
.subArea form{
display: flex;
}
.subArea input{
  width: 96%;
  font-size: 26px;
}

.subArea form .submitters input {
    background-color: rgb(222, 222, 222);
    color: rgb(32, 78, 162);
    font-size: 16px;
    cursor: pointer;
    padding: 4px 12px;
    border-width: initial;
    border-style: none;
    border-color: initial;
    border-image: initial;
    margin: 0;
}
.subArea form .submitters input:hover {
    background-color: rgb(40, 71, 128);
    color: rgb(255, 255, 255);
}


.subArea #news .tabs{
  display: none;
}






.content #works #worksNavi .jigyonoto{
    margin: 0 0 40px 0;
}
.content #works #worksNavi p {
    font-size: 20px;
    font-family: "Sawarabi Gothic";
    color: #fff;
}
.content #works #worksNavi p a{
    color: #fff;
}



#submenu ul {
  width: 80%;
  height: auto;
  background-color: #284780;
  background: linear-gradient(-104deg, transparent 15px, #284780 0);
  text-align: right;
  padding: 0 20px 0 0;
}

#submenu ul li{
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    padding:20px  0;
}

#submenu ul li a{
    border-left: 1px solid #fff;
    padding: 0 20px;
  text-decoration: none;
    display: block;
    color :#fff;
}

#footerSubmenu{
  display: none;
}

.corpinfoPage .flexbox{
   margin: 0 0 40px 0;
   text-decoration: none;
}

.corpinfoPage .txt {
    width: 60%;
}
.corpinfoPage .txt p{
    text-align: center;
    font-size: 180%;
    margin: 120px;
    line-height: 1.5;
    font-weight: bold;
}

.corpinfoPage #con01 .txt {
    background: url(/_themes/base/img/img_bg01i.png) no-repeat center center;
    background-size: contain;
}
.corpinfoPage #con02 .txt {
    background: url(/_themes/base/img/img_bg02i.png) no-repeat center center;
    background-size: contain;
}
.corpinfoPage #con03 .txt {
    background: url(/_themes/base/img/img_bg03i.png) no-repeat center center;
    background-size: contain;
}
.corpinfoPage #con04 .txt {
    background: url(/_themes/base/img/img_bg04i.png) no-repeat center center;
    background-size: contain;
}
.corpinfoPage #con05 .txt {
    background: url(/_themes/base/img/img_bg05i.png) no-repeat center center;
    background-size: contain;
}
.corpinfoPage #con06 .txt {
    background: url(/_themes/base/img/img_bg06i.webp) no-repeat center center;
    background-size: contain;
}



.corpinfoPage figure{
    width: 40%;
}
.corpinfoPage figure img{
   width: 100%;
}

/*-----greeting-----*/
#greetingArea.flexbox{
    justify-content: space-between;
    flex-wrap: wrap;
}

#greetingArea .txt {
    width: 63%;
    margin: 60px 0 0 0;
}

#greetingArea .txt h2{
    font-size: 220%;
    line-height: 1.4;
    margin: 0 0 40px 0;
}

#greetingArea figure{
  width: 30%;
}
#greetingArea figure img{
  width: 100%;
}
#advantageArea .flexbox{
  margin: 0 0 50px 0;
}

#advantageArea figure{
  width: 30%;
  margin: 0 40px 0 0;
}
#advantageArea figure img{
  width: 100%;
}

#advantageArea .txt{
  width: 70%;
}
.content #advantageArea p.point {
    padding: 0.5rem 0 0.5rem 1rem;
    -webkit-transform: skew(-15deg);
    transform: skew(-25deg);
    color: #fff;
    background-image: -webkit-gradient(linear, left top, right top, from(#C59F5E), to(#C59F5E));
    background-image: -webkit-linear-gradient(left, #C59F5E 0%, #C59F5E 100%);
    background-image: linear-gradient(to right, #C59F5E 0%, #C59F5E 100%);
    font-size: 25px;
    line-height: 1.6;
    font-weight: bold;
}

.is-style-whiteboard1 {
    position: relative;
    margin: 0 auto 60px auto;
    padding: 2.5em 0.5em;
    border: 10px solid transparent;
    border-radius: 4px;
    background: linear-gradient(white, white), linear-gradient(#4d4d4d, #4d4d4d) no-repeat 100% 100% / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 0 100% / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 100% 0 / 30px 30px, linear-gradient(#4d4d4d, #4d4d4d) no-repeat 0 0 / 30px 30px, linear-gradient(#e6e6e6, #e6e6e6);
    background-clip: padding-box, border-box, border-box, border-box, border-box, border-box;
    background-origin: border-box;
    font-size: 42px;
    line-height: 1;
    text-align: center;
}
.is-style-whiteboard1:before,
.is-style-whiteboard1:after ,
.is-style-whiteboard1 .wp-block-group__inner-container:before,
.is-style-whiteboard1 .wp-block-group__inner-container:after {
	display: inline-block;
	position: absolute;
	content: "";
}
.is-style-whiteboard1:before {
	right: 10px;
	bottom: 16px;
	width: 52px;
	height: 8px;
	border-radius: 2px 2px 0 0;
	background: #5a95f5;
}
.is-style-whiteboard1:after {
	right: 11px;
	bottom: 1px;
	width: 50px;
	height: 15px;
	border-radius: 0 0 4px 4px;
	background: #d2e2fc;
}
.is-style-whiteboard1 .wp-block-group__inner-container:before {
	right: 71px;
	bottom: 1px;
	width: 48px;
	height: 8px;
	background: linear-gradient(90deg, #ea4335 8%, #f2f2f2 8%, #f2f2f2 70%, #ea4335 70%);
}
.is-style-whiteboard1 .wp-block-group__inner-container:after {
	right: 98px;
	bottom: 9px;
	width: 48px;
	height: 8px;
	background: linear-gradient(90deg, #333 8%, #f2f2f2 calc(8% + 1px), #f2f2f2 70%, #333 calc(70% + 1px));
	transform: rotate(-20deg);
}

#philosophyArea h2,
.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }



ul.timeline-list-alternate {
  padding: 100px;
  margin: 0;
  border: 5px solid #9C8133;
  list-style: none;
}
ul.timeline-list-alternate li {
  list-style: none;
  position: relative;
  width: 50%;
}
ul.timeline-list-alternate li:not(:last-of-type) {
  padding-bottom: 4rem;
}
ul.timeline-list-alternate li:not(:last-of-type)::before {
  content: " ";
  display: block;
  position: absolute;
  background-color: #284780;
  width: 2px;
  height: calc(100% - 1.4rem);
  top: calc(1.5rem + 0.45em);
}
ul.timeline-list-alternate li::after {
  content: " ";
  display: block;
  position: absolute;
  background-color: #9C8133;
  width: 1.6rem;
  height: 1.6rem;
  top: 0.45em;
}
ul.timeline-list-alternate li:nth-of-type(odd) {
  padding-right: 4rem;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
ul.timeline-list-alternate li:nth-of-type(odd)::before {
  right: -1px;
}
ul.timeline-list-alternate li:nth-of-type(odd)::after {
  right: -0.8rem;
}
ul.timeline-list-alternate li:nth-of-type(even) {
  margin-left: auto;
  padding-left: 4rem;
  list-style: none;
}
ul.timeline-list-alternate li:nth-of-type(even)::before {
  left: -1px;
}
ul.timeline-list-alternate li:nth-of-type(even)::after {
  left: -0.8rem;
}

.content .timeline-list-title {
  font-weight: 700;
  font-size: 1.6rem;
  margin-bottom: 1rem;
  color :#284780;
}

.gmap {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 830px;  /* 比率を4:3に固定 */
}

/* Google Mapのiframe */
.gmap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 800px;
}

#accessArea {
  justify-content: space-between;
}

#accessArea .rightArea,
#accessArea .leftArea{
  width: 49%;
}

#accessArea .rightArea{
    padding: 0;
}


#accessArea h2{
    background: url(/_themes/base/img/img_icon_koro.png) no-repeat left center;
    background-size: 12%;
    padding: 20px 20px 20px 80px;
    font-size: 170%;
    border-bottom: 3px solid #9C8133;
}

.docs h2.date {
    background: url(/_themes/base/img/img_icon_koro.png) no-repeat left center;
    background-size: 6%;
    padding: 20px 20px 20px 80px;
    font-size: 170%;
    border-bottom: 3px solid #9C8133;
}


#accessArea dt{
   font-weight: bold;
   font-size:120%;
}
#accessArea dd{
 font-size: 20px;
 line-height: 1.6;
}


.bussinessPage .flexbox{
   margin: 0 0 40px 0;
   text-decoration: none;
    width: 100%;
}

.bussinessPage .txt {
    width: 60%;
}
.bussinessPage .txt p{
    text-align: center;
    font-size: 180%;
    margin: 60px;
    line-height: 1.5;
    font-weight: bold;
}

.bussinessPage #con01 a
.bussinessPage #con02 a,
.bussinessPage #con03 a,
.bussinessPage #con04 a,
.bussinessPage #con05 a,{
  padding: 50px;
  text-decoration: none;
}

.bussinessPage #con01 .txt {
    background: url(/_themes/base/img/img_bg_bu01.webp) no-repeat center center;
    background-size: 80%;
}
.bussinessPage #con02 .txt {
    background: url(/_themes/base/img/img_bg_bu02.webp) no-repeat center center;
    background-size: 80%;
}
.bussinessPage #con03 .txt {
    background: url(/_themes/base/img/img_bg_bu03.webp) no-repeat center center;
    background-size: 80%;
}
.bussinessPage #con04 .txt {
    background: url(/_themes/base/img/img_bg_bu04.webp) no-repeat center center;
    background-size: 80%;
}
.bussinessPage #con05 .txt {
    background: url(/_themes/base/img/img_bg_bu05.webp) no-repeat center center;
    background-size: 80%;
}

.bussinessPage figure{
    width: 40%;
}
.bussinessPage figure img{
   width: 100%;
}

#contentArea.flexbox{
justify-content: space-between;
}

#contentArea.flexbox .mainArea{
  width: 78%;
}

#contentArea.flexbox .subArea{
  width: 20%;
}
#contentArea.flexbox .subArea h2{
  font-size: 120%;
  background-color: #284780;
  padding: 0 10px;
  color: #fff;
}

#contentArea.flexbox #blogleft.subArea h2{
  background-color: #C59F5E;
}

#contentArea.flexbox .subArea .piece{
  margin: 0 0 20px 0;
}

#contentArea.flexbox .subArea .content{
  margin: 0 0 10px 0;
  padding: 0;
}

.maps h2,
.rels h2,
.tags h2,
#contentArea.flexbox .mainArea .clm h2{
    background: url(/_themes/base/img/img_icon_koro.png) no-repeat left center;
    background-size: 8%;
    padding: 20px 20px 20px 80px;
    font-size: 170%;
    border-bottom: 3px solid #9C8133;
    margin: 0 0 30px 0;
}


.resultdocsArea #lead{
  justify-content: space-between;
  margin: 0 0 40px 0;
}

.resultdocsArea #lead figure {
  width: 45%;
}
.resultdocsArea #lead .txt{
  width: 52%;
}

.resultdocsArea #lead img{
  width: 100%;
  height: auto;
}

#contentArea.flexbox .mainArea .clm{
  margin: 0 0 40px 0;
}

#contentArea.flexbox .mainArea .clm th,
#contentArea.flexbox .mainArea .clm td{
  padding: 10px  20px;
  font-size: 120%;
}

#contentArea.flexbox .mainArea .clm table{
  width: 100%;
  border: 2px solid #84A0D4;
}

#contentArea.flexbox .mainArea .clm table th{
  color: #fff;
  background-color: #84A0D4;
  border-bottom: 2px solid #fff;
  width: 30%;
}
#contentArea.flexbox .mainArea .clm table td{
  border-bottom: 2px solid #84A0D4;
}



#gal .flexbox{
  justify-content: space-between;
  align-items: center;
  margin: 0 0 40px 0;
}

#gal ul.flexbox ,
#gal .flexbox li{
list-style:none;
padding: 0;
margin-left:0;
}

#gal .flexbox li{
  width: 49%;
}

#gal .flexbox figure{
  position: relative;
}

#gal .flexbox figure img{
  width: 100%;
  height: auto;
}


#gal .flexbox figcaption{
    position: absolute;
    bottom: 10px;
    left: 10px;
    font-size: 45px;
    font-weight: bold;
    color: #fff;
    line-height:1;
}

#gal .flexbox figcaption:first-letter{
    font-size: 65px;
    color: #fff;
    line-height:1;
}


#intro figure img{
  width: 100%;
}

#contentArea .body .text-beginning h2,
#contArea .clm h2,
ul li h2{
    background: url(/_themes/base/img/img_icon_koro.png) no-repeat left center;
    background-size: 6%;
    padding: 12px 20px 12px 70px;
    font-size: 170%;
    border-bottom: 3px solid #9C8133;
    margin: 0 0 20px 0;
}



#bosuiArea ul li {
   margin: 0 20px;
}

.categoryType h2,
.contentGpCategoryCategoryType h2{
    font-size: 170%;
    margin: 0 0 20px 0;
}

.categoryType h2 a,
.contentGpCategoryCategoryType h2 a{
    display: block;
    background: url(/_themes/base/img/img_icon_koro.png) no-repeat left center;
    background-size: 4%;
    padding: 5px 20px 5px 60px;
    border-bottom: 3px solid #9C8133;
    color: #000;
    text-decoration: none;
}

#infoArea #info #blogArea {
  position: relative;
}


#infoArea #info #blogArea .ttl stong,
#infoArea #info #blogArea .ttl span{
  display: block;
}


#infoArea #info #blogArea .ttl{
  position: absolute;
  top: 30%;
  left: 0%;
  width: 50%;
  text-align: center;
}

#infoArea #info #blogArea p{
  color:#fff;
  font-size: 26px;
  line-height: 1.6;
  text-align: center;
  font-weight: bold;
}

#infoArea #info #blogArea p.ttl  strong{
  font-size: 64px;
  font-family: "Baskervville", serif;
  font-optical-sizing: auto;
  font-weight: 400;
}

#infoArea #info #blogArea .img img{
	width: 100%;
	height: auto;
}
#infoArea #info #blogArea p.ttl  img{
    width: 100%;
    margin: 0 0 0 160px;
}



#ulResult ul#whatsnew{
    display: flex;
    flex-wrap: wrap;
}
#ulResult ul#whatsnew li {
    flex-basis: calc(24.9% - 7px);
    margin: 0 4px;
}

#ulResult ul#whatsnew li .image {
    display: block;
    height: 165px;
    overflow: hidden;
    width: 242px;
}

#ulResult ul#whatsnew li img{
  width: 100%;
  height: auto;
}

.wrapper .content{
    padding: 0 0 40px 0;
}












/*-----ast-----*/

section,
article {
	display: block;
}

img {
	vertical-align: top;
}

a img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}

a:hover img {
	filter: brightness(120%);
}

li {
	list-style-type: none;
}

a {
	color: #0099CC;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
a:hover {
	color: #3C5B6F;
	text-decoration: none;
}

table {
	border-collapse: collapse;
}
table td {
	border-collapse: collapse;
}

.clfix:after{
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}

/*
ヘッダー
-------------------------------------------*/
header {
	width: 100%;
	position: fixed;
	z-index: 3000;
	transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

header.fixed {
	background-color: #111;
	background-color: rgba(242,246,247,0.9);
}

header .h1 a img,
header h1 a img {
    display: block;
    position: absolute;
    width: 300px;
    height: auto;
    top: 10px;
    left: 10px;
}

#footer_logo{
  margin: 0 0 20px 0;
}

#footer_logo a img{
    width: 100%;
    height: auto;
}


#g_navi ul li a.ac_menu {
	cursor: pointer;
	overflow: hidden;
}

#pankuzu {
	font-size: 14px;
	line-height: 30px;
	width: 100%;
	padding: 0 0 30px 0;
}

#pankuzu #breadCrumbs {
	margin-right: auto;
	margin-left: auto;
}

#pankuzu li {
	display: inline-block;
}

#pankuzu li a {
	text-decoration: none;
}

#pankuzu li::after {
	content: ">";
	padding-left: 10px;
	padding-right: 10px;
}



#pankuzu li i {
	padding-right: 5px;
}

#pankuzu li:last-child::after {
	display: none;
}


.content.movie_blk{
  padding: 40px 0;
}

#ulNewsTest .content{
     padding: 10px 0;
}

#consept {
  margin-bottom:40px;
}

#consept img{
  width: 100%;
}
#consept #leftArea{
    width: 45%;
    box-sizing: content-box;
    padding: 35px;
  background-color: #fff;
}

#consept #leftArea h2 {
  font-size: 195%;
  line-height: 1.5;
  font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
  margin: 0 0 20px 0;
}

#consept #rightArea{
  width: 50%;
}

#consept #rightArea figure{
 margin: 0 0 20px 0;
}
#consept #rightArea ul li:first-child{
 margin: 0 10px 0 0;
}
#consept #rightArea ul li:last-child{
 margin: 0 0 0 10px;
}

.content #consept #leftArea p{
  font-size: 100%;
  margin: 0 0 20px 0;
}

.content #consept #leftArea p.btn a{
 display: block;
 border: 1px solid #000;
 padding: 10px;
 width: 400px;
 color: #000;
 text-decoration: none;
 text-align: center;
}

.content #consept #leftArea p.btn a {
  position: relative;
  display: inline-block;
  padding-left: 20px;
}

.content #consept #leftArea p.btn a:hover {
 border: 1px solid #000;
background-color: #000;
 color: #fff;
}


.content #consept #leftArea p.btn a:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #333;
  border-right: solid 2px #333;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  left: 260px;
  bottom: 0;
  margin: auto;
}

.content #consept #leftArea p.btn a:hover:before {
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}


.feed{
  display: none;
}

#newslist .tabs{
  display: none;
}





/*-------------------------------------------
content /conbox
-------------------------------------------*/



.conbox {
  display: grid;
  gap: 0;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 12px;
}



.conbox .ser01pic {
  background-image: url(/_themes/base/img/shop_before.jpg);
}

.conbox .ser02pic {
  background-image: url(/_themes/base/img/shop_after.jpg);
}

.conbox .ser03pic {
  background-image: url(/_themes/base/img/gaiso_before.jpg);
}

.conbox .ser04pic {
  background-image: url(/_themes/base/img/gaiso_after.jpg);
}

.conbox .ser05pic {
  background-image: url(/_themes/base/img/roof_before.jpg);
}

.conbox .ser06pic {
  background-image: url(/_themes/base/img/roof_after.jpg);
}

.conbox .ser07pic {
  background-image: url(/_themes/base/img/landix-_before.jpg);
}

.conbox .ser08pic {
  background-image: url(/_themes/base/img/landix-_after.jpg);
}


#page-business-bosui .conbox .ser01pic {
  background-image: url(/_themes/base/img/uretan_before.jpg);
}

#page-business-bosui .conbox .ser02pic {
  background-image: url(/_themes/base/img/uretan_after.jpg);
}

#page-business-bosui .conbox .ser03pic {
  background-image: url(/_themes/base/img/sheet_before.jpg);
}

#page-business-bosui .conbox .ser04pic {
  background-image: url(/_themes/base/img/sheet_after.jpg);
}


#page-business-shinchiku .conbox .ser01pic {
  background-image: url(/_themes/base/img/shinchiku_no01.jpg);
}

#page-business-shinchiku .conbox .ser02pic {
  background-image: url(/_themes/base/img/shinchiku_no02.jpg);
}

#page-business-kaichiku .conbox .ser01pic {
  background-image: url(/_themes/base/img/yuka_before.jpg);
}

#page-business-kaichiku .conbox .ser02pic {
  background-image: url(/_themes/base/img/yuka_after.jpg);
}

#page-business-shop .conbox .ser01pic {
  background-image: url(/_themes/base/img/shop02_before.jpg);
}

#page-business-shop .conbox .ser02pic {
  background-image: url(/_themes/base/img/shop_after.jpg);
}


.content .bg-dark p{
  font-size: 140%;
    font-size: 200%;
    line-height: 0.6;
}

.content .bg-dark p:first-letter{
    font-size: 65px;
    color: #FF00B2;
    line-height:1;
}

.content .conbox .item h3.headline:after {
    width: unset;
    height: unset;
    position: unset;
    top: unset;
    left: unset;
    background: none;
    content: unset;
    font-weight; bold;
}

.conbox .item {
  background-size: cover;
  background-position: center;
  height: 400px;
  position: relative;
}
.content #pageArea #treatmentArea h3{
    font-size:28px;
}
.content #pageArea #treatmentArea h3:after {
    display: none;
}

.conbox .item .copy {
  position: absolute ;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 30px;
  top: 0;
}

.conbox .item .copymap{
  position: absolute ;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  text-align: center;
}

.conbox .item .bg-dark {
  color: #fff;
}

.conbox .item .headline {
  font-size: 32px;
  font-weight: bold;
  line-height: 1.2;
  font-family: "Sawarabi Mincho";
  margin: 0 0 20px 0;
  padding: 0;
}

.conbox .item .subhead {
  font-size: 100%;
    margin-top: 0;
    margin-bottom: 20px;
    text-align: left;
}

.content .page .conbox .item .copy p{
margin: 0;
padding:0;
text-align: left;
}


.fcontact {
	width: 100%;
	height: auto;
	background-image: url(../img/obi_002.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0 0 50%;
	position: relative;
}

.fcontact .inwrap {
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-flow: column;
	flex-flow: column;
	position: absolute;
	color: #FFF;
	background-color: rgba(0,0,0,0.4);
}

.fcontact h2 {
	font-size: 36px;
}
.fcontact p {
	line-height: 2;
	font-weight: bold;
	font-size: 140%;
}

.fcontact p.telNo{
	font-size: 250%;
}
.fcontact p.telNo a{
  color: #fff;
  text-decoration: none;
}
.text-beginning figure img{
  width: 100%;
  height: auto;
}

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

.fcontact {
    height: 500px;
}
.fcontact h2 {
    font-size: 24px;
}
.btn_cnt a {
    width: 280px !important;
}
.fcontact p {
    font-size: 110%;
}
.conbox {
  display:flex;
  flex-flow: column;
}
.ser01pic {
  order: 1;
}
.ser01 {
  order: 2;
}
.ser02pic {
  order: 3;
}
.ser02 {
  order: 4;
}

.ser03pic {
  order: 5;
}
.ser03 {
  order: 6;
}


.ser04pic {
  order: 7;
}
.ser04 {
  order: 8;
}
.ser05pic {
  order:9 ;
}
.ser05 {
  order: 10;
}
.ser06pic {
  order: 11;
}
.ser06 {
  order: 12;
}
.ser07pic {
  order: 13;
}
.ser07 {
  order: 14;
}
.ser08pic {
  order: 15;
}
.ser08 {
  order: 16;
}



.conbox .item .headline {
   text-align: center;
    font-size: 22px;
    margin: 0 0 10px 0;
}


.conbox .item {
    background-size: cover;
    background-position: center;
    height: 230px;
    position: static;
    margin: 0 0 20px 0;
}
.conbox .item .copy {
    position: static;
    text-align: left;
    padding: 10px 0 0 0;
}

.conbox .item{
        height: auto;
}

.conbox .ser01pic,
.conbox .ser02pic,
.conbox .ser03pic,
.conbox .ser04pic,
.conbox .ser05pic,
.conbox .ser06pic,
.conbox .ser07pic,
.conbox .ser08pic,
.conbox .ser09pic {
    height: 230px;
    margin: 0;
}


    .list-title {
        font-size: 200%;
        margin-left: 5%;
    }    
    .list-title:after {
        width: 40px;
    }    
    .list {
        grid-template-columns: repeat(1, 1fr);
        gap: 1.5%;
        counter-reset: item;
        max-width: 90%;
        margin-left: auto;
        margin-right: auto;
    }
    .icon-q:before, .icon-a:before {
        font-size: 850%;
    }
    .item-front, .item-back {
        height: 380px;
    }
.item-front .item-text {
    padding-top: 120px;
    font-size: 130%;
}
}

/* チュートリアルスタート */
.list-item {
  perspective: 1000px;
}
.item-front {
  z-index: 2;
  backface-visibility: hidden;
}
.item-back {
  position: absolute;
  z-index: 1;
  transform: rotateY(-180deg);
  backface-visibility: hidden;
  top: 0;
  left: 0;
}
.list-item:hover .item-inner,
.list-item:focus .item-inner {
  transform: rotateY(-180deg);
}
.item-inner {
  transform-style: preserve-3d;
  transition: transform 1s ease;
}
.item-back {
 /*-- transition: background-color 2s ease-out;-*/
}
.list-item:hover .item-back,
.list-item:focus .item-back {
  /*-- background-color: lightyellow;-*/
}
#cstory02,
#cstory01 {
  padding: 70px 0;
  border:none;
}

#cstory02 .leftArea,
#cstory01 .leftArea{
  width: 30%;
}

#cstory02 .rightArea,
#cstory01 .rightArea{
  width: 70%;
}

#cstory02 .leftArea img,
#cstory01 .leftArea img{
  width: 100%;
}

#cstory02 .rightArea img,
#cstory01 .rightArea img{
  width: 100%;
}

.content .ep h4 {
    position: relative;
    font-size: 20px;
    padding: 0;
    border:none;
    margin-left: 0px;
    margin-bottom: 20px;
    font-family: "Sawarabi Mincho";
    font-weight: normal;
    line-height: 1;
}


.content .ep{
  margin: 0 0 100px 0;
}

.content .ep h4 .no{
    font-size: 80px;
    font-weight: 600;
    letter-spacing: 10px;
    color: #56A4FD70;
}
.content .ep h4 .eps{
    position: absolute;
    left: 65px;
    top: 33px;
    color: #ffff;
}

.content #next02 h4 .eps,
.content #next01 h4 .eps{
    left: 265px;
}


.episodeArea .ep h5{
  font-size: 26px;
    font-family: "Sawarabi Mincho";
}

#episodeAera02 #no04 .flexbox,
#episodeAera01 #no01 .flexbox{
  position: relative;
}


#episodeAera01 #no01 .flexbox .img{
    position: absolute;
    right: 0;
    z-index: -9;
    width: 56%;
    top: -50px;
}

#episodeAera02 #no04 .flexbox .img{
    position: absolute;
    right: 0;
    z-index: -9;
    width: 56%;
    top: -20px;
}

#episodeAera02 #no01 .flexbox .img img,
#episodeAera01 #no01 .flexbox .img img{
    filter: brightness(61%) contrast(100%) saturate(100%) blur(0px) hue-rotate(0deg);
}


#progress01 .inwrap{
    background: linear-gradient(to top, transparent 0%, transparent 0%, #3c5b6f 40%), url(/_themes/base2/img/img_cyareea_hisory01_image.webp) left 180px;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 150px 0;
    background-attachment: fixed;
}

#progress02 .inwrap{
    background: linear-gradient(to top, transparent 0%, transparent 0%, #3c5b6f 40%), url(/_themes/base2/img/img_reverse.webp) left 180px;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 150px 0;
    background-attachment: fixed;
    position: relative;
    background-repeat: no-repeat;
    padding-right: 0px;
    padding-left: 0px;
    background-size: cover;
    background-attachment: fixed;
}

#progress02 .inwrap img,
#progress01 .inwrap img{
    background-color: rgb(0 0 0 / .7);
    background-blend-mode: overlay;
}

.content .progressArea .leftArea{
  width: 50%;
}
.content .progressArea .rightArea{
  width: 50%;
  margin: 0 0 0 20px;
}
.content .progressArea .rightArea img{
  width: 90% !important;
  height: auto!important;
}

.content .progressArea .rightArea div{
  background-color: #fff;
  padding: 30px;
}

.content .progressArea .rightArea div h3 span {
    display: block;
    color: #fff;
    background-color: #000;
}
.content .progressArea .rightArea div h3 span{
    width: 150px;
}
.content .progressArea .rightArea div h4{
    color: #000;
    line-height: 1.5;
}

.content .progressArea .rightArea div p{
    color: #000;
}

.content .progressArea .rightArea div h3{
  color: #000;
}

.content .progressArea h3 {
	font-size: 24px;
	line-height: 30px;
	margin-bottom: 30px;
	position: relative;
	padding-top: 15px;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
	font-weight: normal;
	color: #fff;
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
	clear: both;
	letter-spacing: 0.05em;
}

.content .progressArea h3::after {
  display: none;
}
.content .progressArea h3 span{
    display: block;
    color: #3C5B6F;
    background-color: #A1F423;
    font-size: 40%;
    width: 60px;
    margin: 10px 0 0 0;
    text-align: center;
    padding: 0;
}

.content .progressArea h4 {
	font-size: 20px;
	color: #fff;
	border: none;
	line-height;1.6;
	letter-spacing: 0.1em;
	padding: 0;
	font-weight: bold;
	clear: both;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 20px;
	margin-left: 0;
	font-family: "Sawarabi Mincho", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
#btncary {
justify-content: space-around;
 padding: 20px 0;
}
#btncary li {
  width: 100%;
  font-family: "Sawarabi Mincho"; 
  font-size: 120%;
  margin: 0 20px 0 0;
}
#btncary li:last-child {
  margin-right: 0;
}

#btncary li a{
  border: 1px solid #3C5B6F;
  display: block;
  text-align: center;
  background-color: #3C5B6F;
  color: #fff;
  padding: 30px 0;
  text-decoration: none;
  position: relative;
}
#btncary li a:hover{
  background-color: #fff;
  color: #000;
  border: 1px solid #3C5B6F;
}
#btncary li a:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  transform: rotate(45deg);
  position: absolute;
  margin: auto;
}



#btncary li:first-child a:before {
  top: 0;
  left: 400px;
  bottom: 0;
}


#btncary li:last-child a:before {
  top: 0;
  left: 350px;
  bottom: 0;
}
#btncary li:last-child a:hover::before,
#btncary li:first-child a:hover::before {
  border-top: solid 2px #000;
  border-right: solid 2px #000;
}



.submit input{
    width: 250px;
    margin: 0 auto 30px auto;
    background-color: #ff7f00;
    color: #fff;
    display: block;
    padding: 10px;
    border: none;
    -webkit-appearance: none;
    font-size: 18px;
}
.submit input:hover{
opacity: 0.8;
}

#errorExplanation{
    border: 1px solid #ff0000;
    margin-bottom: 20px;
    padding: 20px;
}


#errorExplanation h2 {
    color: #ff0000;
    background-image: none !important;
    padding: 0 !important;
    margin: 0 0 10px 0!important;
}

#errorExplanation p {
    font-weight: bold;
    margin: 0 0 10px 0!important;
}


 #errorExplanation ul {
    margin: 0 0 0 30px;
}

 #errorExplanation li {
     list-style-type: disc;
    color: #ff0000;
    margin: 0 0 5px 0;
}


/* ------------
mailform
---------------------------------------------------------------------------------*/
.note {
    background-color: #DD3C3C;
}
.note {
    display: inline-block;
    float: left;
    font-weight: bold;
    color: #ffffff;
    padding: 3px 5px;
    border-radius: 3px;
}
.captchaForm .reload,
.captchaForm .talk {
  display: inline-block;
  border: 1px solid #aaa;
}

.captchaForm .image{
    margin-bottom: 20px;
}
.reload a,
.talk a{
display: block;
text-decoration: none;
  padding: 5px 10px;
}
.field {
  margin-top: 15px;
}

form {
	width : auto;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
form .question,
form .questions {
    width: 90%;
    max-width: none;
    overflow : hidden;
    padding: 0;
    margin: 0 auto;
}
form .questions  .question{
	width : auto;
	max-width: none;
	overflow : hidden;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}

.question_content {
	clear : both;
	width : 38%;
	float : left;
	border-top : 1px solid #cccccc;
	text-align : left;
	overflow : hidden;
	padding-top: 15px;
	padding-right: 2%;
	padding-bottom: 15px;
	padding-left: 0;
	line-height: 1.8;
	font-weight: bold;
}

.question_content .note{
        margin: 0 20px 0 0;
}

.answer_content{
	width : 62%;
	float : right;
	border-top : 1px solid #cccccc;
	padding-top: 20px;
	padding-right: 0;
	padding-bottom: 15px;
	padding-left: 0;
}



.surveyForm form .questions .question .answer_content input,
.surveyForm form .questions .question .answer_content textarea {
    font-size: 18px;
    width: 80%;
    background-color: white;
    border: 1px solid #bebebe;
}


.field input,
.surveyForm form .questions .question .answer_content input {
        height: 32px;
        padding: 2px;
}
.surveyForm form .questions .question .answer_content input[type="radio"], .surveyForm form .questions .question .answer_content input[type="checkbox"] {
    width: 24px;
    height: 24px;
   vertical-align: middle;
}

.surveyForm{
padding: 0 0 80px 0;
}

#status.piece {
background-color: #3472a9;
padding-bottom: 50px;
}

/*-------------------------------------------
ZOMEKI 専用CSS　ここから
-------------------------------------------*/
/*---
top tab
----------------------------*/
#page-index .tabs {
 display :none;
}

.sitepolicy__cont .clm,
.privacyArea .clm{
  margin: 0 0 30px 0;
}

/*---
atom rss feed 
----------------------------------------------*/
.contentGpCategoryCategoryType  ul.feed ,
.contentGpCategory  ul.feed ,
.categoryType ul.feed ,
.contentGpArticleDocs ul.feed ,
.contentGpArticleDocs ul.feed {
    margin: 0 0 30px 0;
    overflow: hidden;
    position: absolute;
    right: 332px;
    top: 510px;
}


.feedRss {
    background-image: url("/_themes/base/images/ic-rss.png");
    background-position: left top;
    background-repeat: no-repeat;
    display: block;
    float: left;
    height: 20px;
    margin: 0 5px 0 0;
    text-indent: -9999px;
    width: 49px;
}
.feedAtom {
    background-image: url("/_themes/base/images/ic-atom.png");
    background-position: right top;
    background-repeat: no-repeat;
    display: block;
    float: left;
    height: 20px;
    text-indent: -9999px;
    width: 49px;
}


ul.feed li{
      float: left;
    width: 49px !important;
    height: 20px;
    margin: 0 !important;
    padding:0 !important;
   border: none !important;
}

.more {
    display: block;
    margin-top: 10px;
    padding: 0px 5px 0px 0px;
    text-align: right;
}




.contentGpCategoryCategory,
.contentGpCategoryCategoryType,
.categoryType,
.contentGpArticleDocs{
position: relative;
}


.contentGpCategoryCategory li,
.contentGpCategoryCategoryType li,
.categoryType li,
.contentGpArticleDocs li{
margin: 0 0 10px 0;
padding: 0 0 10px 0;
border-bottom: 1px dotted #003399;
}

.contentGpCategoryCategory li:after,
.contentGpCategoryCategoryType li:after,
.categoryType li:after,
.contentGpArticleDocs li:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.contentGpCategoryCategory li:last-child,
.contentGpCategoryCategoryType li:last-child,
.categoryType li:last-child,
.contentGpArticleDocs li:last-child{
margin: 0 0 40px 0;
padding: 0;
border: none;
}


.contentGpCategoryCategory .image,
.contentGpCategoryCategoryType .image,
.categoryType .image,
.contentGpArticleDocs .image{
    display: block;
    float: left;
/*--    height: 180px;  --*/
    margin: 10px 20px 10px 0;
    overflow: hidden;
    width: 250px;
}

.contentGpCategoryCategory .image a,
.contentGpCategoryCategoryType .image a,
.categoryType .image a,
.contentGpArticleDocs .image a{
display: block;
}

.contentGpCategoryCategory .image img,
.contentGpCategoryCategoryType .image img,
.categoryType .image img,
.contentGpArticleDocs .image img{
width: 100%;
}

.contentGpCategoryCategory .body,
.contentGpCategoryCategoryType .body,
.categoryType .body,
.contentGpArticleDocs .body{
    font-size: 96%;
    line-height: 1.6;
    margin: 0 0 5px;
}

.contentGpCategoryCategory .docs li .title_link,
.contentGpCategoryCategoryType .docs li .title_link,
.categoryType .docs li .title_link,
.contentGpArticleDocs .docs li .title_link{
    font-size: 145%;
    display: block;
    font-weight: bold;
    line-height: 1.2;
}


#common .contentGpCategoryCategory h2 a,
#common .contentGpCategoryCategoryType h2 a,
#common .categoryType h2 a,
#common .contentGpArticleDocs h2 a{
    color: #000;
}


.contentGpCategoryCategoryType  ul.feed ,
.contentGpCategory  ul.feed ,
.categoryType ul.feed ,
.contentGpArticleDocs ul.feed ,
.contentGpArticleDocs ul.feed {
    margin: 0 0 30px 0;
    overflow: hidden;
    /* padding: 0 0 0 1087px; */
    position: absolute;
    right: 22px;
}


.contentGpCategoryCategoryType  ul.feed ,
.contentGpCategory  ul.feed {
    top: -76px;
}

/*#submanu
----------------------------------------------------------*/
#submanu {
    max-width: 80%;
    background-color: #f0c9c9;
    margin: 100px auto 50px auto;
    padding: 10px;
 clear: both;
}
#submanu dl {
    border-top: 2px solid #ad0e15;
}
#submanu dl a {
    text-decoration: none;
}
#submanu dl dt {
    border: 1px solid #e3e3e3;
    font-size: 150%;
    line-height: 100%;
    margin: 0 0 5px;
}
#submanu dl dt a {
    background-color: #ad0e15;
    border: 1px solid #fff;
    color: #fff;
    display: block;
    padding: 20px 20px;
}
#submanu dl dd {
    background-color: #fff;
    color: #ad0e15;
    float: left;
    width: 50%;
   font-size:120%;
}
#submanu dl dd a {
    color: #ad0e15;
    display: block;
    padding: 20px 0 20px 5px;
    border: 4px solid #ad0e15;
    border-right: none;
    border-top: none;
}
#submanu dl dd a:hover {
    color: #fff;
    background-color: #ad0e15;
}
#submanu .pieceBody {
    background-color: #eeeeee;
    margin: 0 3px;
    padding: 5px 10px;
}
#submanu .pieceBody li {
    background-image: url("../base/images/ic-list03.gif");
    background-position: left center;
    background-repeat: no-repeat;
    display: inline;
    padding: 0 20px 0 15px;
}

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

/*news tab
------------------------------------------------------*/


#memberlist ul li:after{
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden;
}

#memberlist ul li{
    background: none;
    background-position: 0;
    padding-left: 0;
    padding-right: 0;
}
 span.title_link a{
    line-height: 1.4;
    text-decoration:none;
}
 span.title_link a:hover{
    text-decoration:underline;
}


#memberlist nav.tabs li a{
text-decoration:none;
color: #3C78C5;
display: block;
background-color: #ECECEC;
padding: 8px 0;
}

#memberlist nav.tabs li.current a{
background-color: #3C78C5;
font-weight: bold;
color: #fff;
}

#memberlist nav.tabs ul{
    width: 80%;
}

#memberlist nav.tabs li {
    border-right: medium none;
    color: #333333;
    float: left;
    height: auto !important;
    text-align: center;
    text-decoration: none;
    width: 12.7%;
    margin: 0 2px 0 0 !important;
    font-size: 120%;
}


#memberlist .content ul li{
clear: both;
padding: 5px 0px;
margin: 0 0 5px 0;
border-bottom: 1px dotted #5a2f2e;
}

#memberlist .content ul li:last-child{
border-bottom: none;
}

#memberlist .content ul li .image{
    display: block;
    float: left;
    height: 200px;
    margin: 0px 20px 20px 0;
    overflow: hidden;
    width: 242px;
}

#memberlist .content ul li .category{
    display: inline-block;
    font-size: 60%;
}


ul li .category{
    font-size: 72%;
}

ul li .category span{
    margin: 0 4px;
}

ul li .category span {
    background-color: #9C8133;
    color: #fff;
    padding: 2px 8px;
    text-decoration: none;
    border-radius: 0;
    width: auto;
    display: inline-block;
    text-align: center;
}

#ulNews ul li .title_link{
   margin: 0 0 5px 0;
    font-size: 180%;
    display: block;
    font-weight: bold;
}


#memberlist .content ul li .title_link{
   margin: 0 0 5px 0;
    font-size: 110%;
    display: block;
    font-weight: bold;
}

#memberlist .content ul li .publish_date{
text-align: right;
}

#memberlist .content ul li .body{
    margin: 0 0 5px 0;
    font-size: 96%;
    line-height: 1.4;
}

#memberlist .content ul li .image img{
width: 100%;
}

#jpbsArea .cont_wrap  h2 {
    text-align: center;
    font-family: "Sawarabi Mincho";
    font-size: 250%;
    margin: 0 0 20px 0;
}

/*-------------------------------------------
ZOMEKI 専用CSS　ここまで
-------------------------------------------*/

/* contentGpArticleDoc
----------------------------------------------- */
.contentGpArticleDoc .date {
  margin-bottom: 1em;
  text-align: right;
}

.contentGpArticleDoc .date p {
  display: inline-block;
}



.contentGpArticleDoc .date p.publishedAt {
  padding-right: 10px;
}


/*
メインコンテンツ
-------------------------------------------*/
.content {
	width: 100%;
	padding: 40px 0 140px 0;
	background-color: #fff;
	color: #111;
}

#docsArea .text-beginning,
#docsArea .date,
#docsArea .docs,
#event .pieceContainer,
#event .pieceContainer,
.cont_wrap {
	max-width: 1200px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}

#sub_top {
	background-color: #555;
	background-repeat: no-repeat;
	background-position: top;
	background-attachment: fixed;
	height: 340px;
	line-height: 30px;
	padding-top: 180px;
	width: 100%;
	background-size: 100%;
	text-align: center;
	font-weight: bold;
	color: #FFF;
	font-size: 34px;
	letter-spacing: 0.1em;
	-moz-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	-webkit-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	-ms-text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
}

#index_top {
	height: 100%;
	width: 100%;
	position: relative;
	overflow: hidden;
}


#index_top #top_catch {
    position: absolute;
    top: 62%;
    left: 50px;
    z-index: 10;
    margin-top: -250px;
    margin-left: 0;
    color: #FFF;
    font-weight: 400;
    text-transform: uppercase;
    font-style: italic;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    text-align: left;
}

#index_top #top_catch h2 {
    font-size: 40px;
    letter-spacing: 1px;
    font-family: "Sawarabi Mincho", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho;
    line-height: 1.5;
    font-weight: bold;
}

#index_top #top_catch img {
   width: 65%;
}

#index_top #top_catch p {
	font-size: 35px;
	font-weight: bold;
	letter-spacing: 1px;
	line-height: 2.4;
    font-family: "Sawarabi Mincho", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho;
}

.content h1 {
    line-height: 1.4;
    margin-bottom: 40px;
    letter-spacing: 1px;
    color: #284780;
    clear: both;
    font-size: 38px;
    font-family: "Sawarabi Gothic";
}

.content h2 i {
	padding: 10px;
	color: #71F0BD;
}

.content h2 span {
	font-family: "Sawarabi Mincho"; 
	font-size: 24px;
	color:#3C5B6F;
	font-weight: bold;
	letter-spacing: 0.1em;
}

.content h2 span.small {
	font-size: 18px;
	font-weight: normal;
	color: #555;
}

.content h3 {
	font-size: 24px;
	line-height: 30px;
	margin-bottom: 30px;
	position: relative;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 14px;
	font-weight: normal;
	color: #000;
/**--font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;--*/
	clear: both;
	letter-spacing: 0.05em;
}

.content h3::after {
	display: block;
	width: 3px;
	height: 20px;
	position: absolute;
	top: 20px;
	left: 0px;
	background-color: rgb(197, 159, 94);
	content: '';
}

.content h3 span {
	font-size: 15px;
	color: #555;
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	padding-left: 15px;
}
.content h4 {
    font-size: 20px;
    color: #C59F5E;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: rgb(197, 159, 94);
    letter-spacing: 0.1em;
    font-weight: bold;
    clear: both;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 10px;
}
.content h5 {
    font-size: 18px;
    color: #C59F5E;
    letter-spacing: 0.1em;
    font-weight: bold;
    clear: both;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 10px;
    border-bottom: 1px dotted rgb(197, 159, 94);
}
.content h6 {
    font-size: 18px;
    color: #C59F5E;
    margin-bottom: 20px;
}


.body .text-beginning blockquote{
    position:relative;
    border-left:3px solid rgb(197, 159, 94);
    padding-left:10px;
    margin: 0 0 30px 0;
}
.body .text-beginning blockquote:before{
    position:absolute;
    font-family:'FontAwesome';
    content:'\f10d';
    font-size: 20px;
    color: rgb(197, 159, 94);
}
.body .text-beginning blockquote p{
    position:relative;
    padding-left:30px;
}
.body .text-beginning blockquote cite{
    display: block;
    font-size:0.8rem;
    color: rgb(197, 159, 94);
    text-align:right;
}

.body .text-beginning table {
    width: 100%;
}
.body .text-beginning table th {
    background-color: rgb(249, 243, 232);
    font-weight: normal;
}

.body .text-beginning table th, .body .text-beginning table td {
    text-align: left;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(197, 159, 94);
    border-image: initial;
    padding: 10px;
}
.body .text-beginning ul, .body .text-beginning ol {
    padding: 0px 0px 0px 25px;
    margin: 0px 0px 30px;
}

.body ol li {
    list-style-type: decimal;
}

.body ul li {
    list-style-type: circle;
}

.content p {
	font-size: 20px;
	padding-bottom: 10px;
}


/* CKEditor templates
----------------------------------------------- */
.temp1,
.temp2,
.temp3,
.temp4 {
  clear: both;
  margin-bottom: 20px;
}

.temp1 .thumb {
  float: left;
  margin-bottom: 10px;
  margin-right: 20px;
}

.temp1 ul,
.temp1 ol {
  display: inline-block;
  vertical-align: top;
}

.temp2 .thumb {
  float: right;
  margin-bottom: 10px;
  margin-left: 20px;
}

.temp3,
.temp4 {
  display: flex;
  justify-content: center;
}

.temp3 dl,
.temp4 dl {
  margin: 0 5px;
  padding: 0;
  vertical-align: bottom;
}

.temp3 dl {
  max-width: 48%;
}

.temp4 dl {
  max-width: 31%;
}

.temp3 dl dt,
.temp4 dl dt {
  margin-bottom: 10px;
  text-align: center;
}

.temp3 dl dd,
.temp4 dl dd {
  margin: 0;
  text-align: center;
}

table.temp5,
table.temp6 {
  margin-bottom: 30px;
}

.temp5 caption,
.temp6 caption {
  text-align: center;
}

.temp5 th,
.temp5 td,
.temp6 th,
.temp6 td {
  padding: 6px 10px;
  border: 1px solid #b3b3b3;
  text-align: center;
}

.adobeReader,
.temp7 {
  clear: both;
  margin: 0 0 20px;
  padding: 10px 20px 10px 196px;
  border: 1px solid #faa;
  background: #fff3f3 url("/_themes/base/images/adobe_bn.png") no-repeat 20px center;
}

.adobeReader p,
.temp7 p {
  margin: 0 0 10px;
}

@media only screen and (max-width: 959px) {
  .temp1 .thumb,
  .temp2 .thumb {
    float: none;
    margin: 0 0 1rem;
    text-align: center;
  }

  .temp3,
  .temp4 {
    flex-wrap: wrap;
  }

  .temp3 dl,
  .temp4 dl {
    max-width: 100%;
  }

  .adobeReader,
  .temp7 {
    padding: 55px 20px 10px;
    background-position: center 10px;
  }
}

/* clearfix
----------------------------------------------- */
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}






/* ----------------------------
トップ新着一覧
-------------------------------- */
.content #ulNewsTest li {
	font-size: 16px;
}
.content #ulNewsTest li span.publish_date {
	padding-right: 20px;
	color: #888;
}

.content #ulNewsTest li span span{
	display: inline-block;
	padding-left: 5px;
	padding-right: 5px;
	color: #FFF;
	margin-right: 5px;
}
.content #ulNewsTest li span span.news-event-test{
	background-color: #36BEAD;
}
.content #ulNewsTest li span span.news-whatsnew-test{
	background-color: #F90;
}

.content #ulNewsTest li{
	line-height: 30px;
	padding: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
}
.content #ulNewsTest li a {
	color: #333;
	padding: 20px;
	text-decoration: none;
}

.content #ulNewsTest li:hover {
	color: #000;
	background-color: #FFF;
}



.img_center {
	display: block;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.img_center span {
	position: absolute;
	background-color: #333;
	background-color: rgba(0,0,0,0.8);
	color: #FFF;
	letter-spacing: 0.1em;
	padding: 10px;
	left: 0;
	top: 0;
}

.img_center div {
	position: absolute;
	background-color: #333;
	background-color: rgba(0,0,0,0.8);
	color: #FFF;
	letter-spacing: 0.1em;
	padding: 50px;
	right: 0;
	bottom: 0;
}


.img_left {
	float: left;
	padding-top: 20px;
	padding-right: 50px;
	padding-left: 30px;
	padding-bottom: 20px;
	max-width: 50%;
}
.img_right {
	float: right;
	padding-top: 20px;
	padding-right: 30px;
	padding-left: 50px;
	padding-bottom: 20px;
	max-width: 50%;
}

.img_left img,
.img_right img,
.img_center img {
	width: 100%;
}

.content .img_left p,
.content .img_right p {
	font-size: 14px;
	margin: 0px;
	text-align: center;
	letter-spacing: 0.1em;
	color: #455E65;
}

.content p.check {
	color: #FF3333;
}
.content p.p_st {
	font-size: 20px;
	color: #CA28B1;
}

.content .cont_wrap .txt_box {
	background-color: #E6EDEE;
	padding: 20px;
	margin: 20px;
}
.content .cont_wrap .txt_box h3 {
	margin-top: 0px;
	margin-bottom: 0px;
	text-align: center;
	padding-right: 0px;
	padding-left: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #B6CACD;
	border-radius: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	color: #333;
}
.content .cont_wrap .txt_box h3::after {
	display: none;
}

a.ap {
	padding-top: 50px;
	margin-top: -50px;
}

/*
コンテンツ大ボタン
-------------------------------------------*/
.more a{
	font-size: 16px;
	text-decoration: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	line-height: 22px;
	padding-top: 14px;
	clear: both;
	font-weight: bold;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	position: relative;
	display: inline-block;
 	color: #000;
 	font-family: "Sawarabi Mincho", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

.more a:hover {
 color: #3C5B6F;
}


.more a:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #333;
  border-right: solid 2px #333;
  transform: rotate(45deg);
  position: absolute;
    top: 12px;
    left: -14px;
    bottom: 0;
  margin: auto;
}


.btn_cnt a {
	font-size: 18px;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	display: block;
	width: 500px;
	background-color: #284780;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
	line-height: 22px;
	padding-top: 25px;
	padding-bottom: 25px;
	clear: both;
	font-weight: bold;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
.btn_cnt a i {
	padding-right: 10px;
}
.btn_cnt a:hover {
	color: #284780;
	background-color: #FFF;
}

.btn_cnt.rt a {
	float: right;
	max-width: 220px;
	margin-right: 10px;
}

#news li{
     font-family: "Sawarabi Mincho", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
    margin: 0 0 10px 0;
}
#news li:last-child{
    margin: 0;
}

/*
トップへ戻るボタン
-------------------------------------------*/
.to_top {
	position: fixed;
	bottom: 0px;
	right: 0px;
	z-index: 800;
}
.to_top a {
	text-decoration: none;
	text-align: center;
	display: block;
	width: 60px;
	height: 60px;
	background-color: #DCE7E9;
	color: #333;
	text-align: center;
	font-size: 32px;
	line-height: 60px
}
.to_top a:hover {
	background-color: #3C5B6F;
	color: #FFF;
}

/*
フッター
-------------------------------------------*/

footer {
	background-color: #9C8133;
	color: #fff;
	clear: both;
	width: 100%;
	display: block;
	padding-top: 20px;

}

footer .cont_wrap {
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

footer .cont_wrap .f_box {
	width: 20%;
	padding: 10px;
}

footer .cont_wrap .f_box.lg {
	width: 30%;
}

footer .cont_wrap dt {
  font-size: 16px;
  border-bottom: 1px dotted #fff; 
  padding:0 0 5px 0;
}

footer .cont_wrap p {
  font-size: 16px;
  border-bottom: 1px dotted #fff; 
  padding: 0 0 5px 0;
}
footer .cont_wrap p a{
  display: block;
}

footer .cont_wrap ul li a,
footer .cont_wrap p a,
footer .cont_wrap dl a {
	display: block;
	text-decoration: none;
	font-size: 90%;
	color: #fff;
  font-family: "Sawarabi Mincho"; 
}


footer .cont_wrap ul li a:hover,
footer .cont_wrap p a:hover ,
footer .cont_wrap dl a:hover {
	color: #111;
	background-color: #FFF;
}

address {
	clear: both;
	font-size: 9px;
	font-style: normal;
	padding: 20px;
	text-align: center;
	letter-spacing: 1px;
}

footer .box_pr {
	clear: both;
	width: 100%;
	display: block;
	text-align: center;
	font-size: 10px;
	color: #55838A;
	letter-spacing: 1px;
	background-color: #D2E1E3;
	padding-top: 18px;
	line-height: 22px;
}

.box_pr ul li {
	display: inline;
	padding: 5px;
}

.box_pr ul li a {
	color: #55838A;
}


/*
各種テーブル
-------------------------------------------*/
.content table.table_01 {
	width: 96%;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
}
.content table.table_01 th,
.content table.table_01 td {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #888;
	padding: 20px;
}
.content table.table_01 th {
	font-size: 16px;
	white-space: nowrap;
	font-weight: normal;
	letter-spacing: 1px;
	width: 33%;
}
.content table.table_01 td {
	font-size: 14px;
	line-height: 30px;
	background-color: #FFF;
}

.small {
	font-size: smaller;
	color: #666;
}
.chui {
	color: #F03600;
}

.table_01 caption {
	font-size: 14px;
	line-height: 30px;
	background-color: #E5E5E5;
	color: #111;
	letter-spacing: 1px;
	padding-top: 5px;
	padding-bottom: 5px;
	border: 1px solid #FFF;
	box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px 0px;
}
.table_01 th span {
	font-size: 12px;
	color: #CCC;
}


/*
トップ下部ピックアップ
-------------------------------------------*/
.pick_up {
	width: 100%;
}


.pick_up ul {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 1400px;
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.pick_up ul li {
	width: 32%;
	position: relative;
}
.pick_up ul li a {
	display: block;
	overflow: hidden;
	position: relative;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}
.pick_up ul li a img {
	width: auto;
	max-width: 100%;
	z-index: 0;
}
.pick_up ul li a:hover img {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}

.pick_up ul li a::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(92,189,202,0.2);
	z-index: 5;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}

.pick_up ul li a:hover::before {
	background-color: rgba(54,190,173,0.9);
}


.pick_up ul li a div {
	color: #FFF;
	font-size: 32px;
	line-height: 1;
	text-decoration: none;
	text-align: center;
	display: block;
	width: 80%;
	margin-top: -20px;
	margin-left: -40%;
	position: absolute;
	left: 50%;
	top: 47%;
	font-weight: bold;
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
	z-index: 10;
}
.pick_up ul li a div span {
	font-size: 16px;
	letter-spacing: 2px;
}


/*
コンテンツボックス
-------------------------------------------*/
.box_cont .pieceContainer,
.box_cont .docs,
.box_cont .date,
.box_cont .contentGpCategory,
.box_cont .categoryType,
.box_cont .body{
	width: 100%;
	max-width: 1200px;
	margin: auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	padding-top: 20px;
	padding-right: 20px;
	padding-left: 20px;
}

.box_cont .body .box_c_in {
	width: 48%;
	min-height: 200px;
	padding: 10px;
	border: 1px solid #CFDEE0;
	margin-bottom: 30px;
}

.box_cont .body .box_c_in:hover {
	background-color: #FFF;
	border-top-color: #3C5B6F;
	border-right-color: #3C5B6F;
	border-bottom-color: #3C5B6F;
	border-left-color: #3C5B6F;
}

.box_cont .body .box_c_in img {
	max-width: 100%;
	padding: 20px;
}

.content .box_cont .body .box_c_in h2 {
	padding-bottom: 10px;
	font-size: 24px;
	border-bottom-width: 1px;
	border-bottom-color: #CCC;
	padding-top: 10px;
}

/*
背景入り帯
-------------------------------------------*/

.obi_001 {
	background-image: url(../img/obi_001.jpg);
	background-repeat: no-repeat;
	text-align: center;
	padding-top: 15%;
	padding-right: 20px;
	padding-bottom: 15%;
	padding-left: 20px;
	background-size: cover;
	background-attachment: fixed;
	background-position: center bottom;
	color: #FFF;
	margin-top: 50px;
	margin-bottom: 50px;
}

.content .obi_001 h2 {
	color: #FFF;
	border-bottom: none;
	padding-bottom: 0px;
}
.obi_001 p {
	line-height: 2.4;
}


.obi_002 {
	width: 100%;
	height: auto;
	background-image: url(../img/obi_002.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0 0 50%;
	position: relative;
}

.obi_002 .box_in {
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-flow: column;
	flex-flow: column;
	position: absolute;
	color: #FFF;
	background-color: rgba(54,190,173,0.8);
}

.obi_002 h2 {
	font-size: 36px;
}
.obi_002 p {
	line-height: 2;
	font-weight: bold;
}




@media screen and (min-width:960px){
body {
	font-size: 16px;
}

/*
ヘッダー
-------------------------------------------*/
header {
	height: 90px;
}

header #top_logo a img,
header h1 a img {
        top: 8px;
        left: 20px;
        height: auto;
}

.menu_btn,
.btn_close {
	display: none;
}



/*
PCグローバルナビ
-------------------------------------------*/

#g_navi li.contact a {
	background-color: #284780;
	color: #FFF !important;
	padding: 3px 20px;
	margin-right: 10px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
#g_navi li.contact a:hover {
	background-color: #4A69A1;
	color: #3C5B6F !important;
}

#g_navi li.tel {
	background-color: #C59F5E;
	color: #FFF !important;
	padding-left: 20px;
	padding-right: 20px;
	margin-right: 10px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
        padding: 7px;
        font-weight: bold;
}

#g_navi li.contact a::before {
	display: none;
}

.tooltip{
  display: none;
}

#g_navi .gnav li a {
  margin: 0 12px 0 0;
	font-size: 18px;
}

#g_navi .gnav li.ac a{
  margin: 0 0 0 0;
}


#g_navi {
	position: absolute;
	right: 10px;
	top: 0px;
	width: 530px;
	margin-left: 0;
	display: block !important;
	z-index: 1000;
}

#g_navi ul li{
	display: inline;
}

#g_navi ul.tnav{
 margin: 0;
  float: right;
}
#g_navi ul.gnav{
        clear: both;
        float: right;
        margin: 9px 9px 0 0;
        width: 610px;
}

#g_navi ul.gnav li{
        margin: 0 10px 0 0;
        display: block;
}
#g_navi ul.gnav li.ac a{
        margin: 0;
}

#g_navi li a {
	width: auto;
	line-height: 30px;
	display: block;
	color: #284780;
	text-decoration: none;
	text-align: center;
	position: relative;
	float: left;
	letter-spacing: 1px;
	font-size: 14px;
	font-weight: bold;
}

#g_navi li a::before {
	display: block;
	height: 2px;
	position: absolute;
	top: 2px;
	width: 70%;
	left: 15%;
	background-color: rgba(17,187,221,0);
	content: '';
	-webkit-transition: 0.2s linear;
	-moz-transition: 0.2s linear;
	transition: 0.2s linear;
}

#g_navi li a:hover::before {
	background-color: rgba(17,187,221, 1);
	top:0px;
	width: 80%;
	left: 10%;
}

#g_navi li a:hover {
	color: #3C5B6F !important;
}

#g_navi.txt_w li a {
	color: #FFF;
}

header.fixed #g_navi.txt_w li a {
	color: #111;
}

#g_navi li.contact a {
	background-color: #284780;
	color: #FFF !important;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: 10px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
#g_navi li.contact a:hover {
	background-color: #FFF;
	color: #3C5B6F !important;
}
#g_navi li.contact a::before {
	display: none;
}


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

#index_top {
	min-height: 850px;
}

#sub_top.sample {
	background-image: url(../img/sub_top_sample.jpg);
}
#sub_top.faq {
	background-image: url(../img/sub_top_faq.jpg);
}
#sub_top.contact {
	background-image: url(../img/sub_top_contact.jpg);
}
#sub_top.news {
	background-image: url(../img/sub_top_news.jpg);
}
#sub_top.concept {
	background-image: url(../img/sub_top_concept.jpg);
}
#sub_top.works {
	background-image: url(../img/sub_top_works.jpg);
}
#sub_top.about {
	background-image: url(../img/sub_top_about.jpg);
}

.no_pc {
	display: none !important;
}

}
/*-------------- /～960px ------------*/

@media screen and (min-width:1200px){
header #top_logo a img,
header h1 a img {
        top: 8px;
        left: 10px;
}

header #g_navi {
	right: 0;
	margin-right: 0;
}

}

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

body {
	font-size: 16px;
}

body.fixed {
	overflow: hidden;
}

img {
	max-width: 100% !important;
	height: auto;
	width /***/:auto;
	margin-left:auto;
	margin-right:auto;
}

.content h4 {
	margin-right: 10px;
	margin-left: 10px;
}


/*
メニューボタン
-------------------------------------------*/

.menu_btn {
	display: block;
	height: 40px;
	width: 40px;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	position: fixed;
	z-index: 5000;
	top: 5px;
	right: 5px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	cursor: pointer;
}
.menu_btn:hover {
	cursor: pointer;
}

.menu_btn span {
	width: 28px;
	height: 2px;
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -14px;
	background-color: #3C5B6F;
}
.menu_btn span {
    transition: all 0.3s;
    transform: rotate(0deg);
	-webkit-transform: rotate(0deg);  
    -moz-transform: rotate(0deg);    
  }
.menu_btn span.top {
    transform: translateY(-8px);
	-webkit-transform: translateY(-8px);  
    -moz-transform: translateY(-8px);    
  }
.menu_btn span.bottom {
    transform: translateY(8px);
	-webkit-transform: translateY(8px);  
    -moz-transform: translateY(8px);    
}


.menu_btn:hover span.top {
    transform: translateY(-10px);
	-webkit-transform: translateY(-10px);  
    -moz-transform: translateY(-10px);    
}
.menu_btn:hover span.bottom {
    transform: translateY(10px);
	-webkit-transform: translateY(10px);  
    -moz-transform: translateY(10px);    
}

.menu_btn.opened span {
	background-color: #7BC;
}

.menu_btn.opened span.middle {
    background: rgba(255, 255, 255, 0);
	 transform: translateX(30px);
	 -webkit-transform: translateX(30px);  
    -moz-transform: translateX(30px);    
}
.menu_btn.opened span.top {
    transform: rotate(-45deg) translateY(0px);
	-webkit-transform: rotate(-45deg) translateY(0px);  
    -moz-transform: rotate(-45deg) translateY(0px);    
}
.menu_btn.opened span.bottom {
    transform: rotate(45deg) translateY(0px);
	-webkit-transform: rotate(45deg) translateY(0px);  
    -moz-transform: rotate(45deg) translateY(0px);    
}

/*
グローバルナビ
-------------------------------------------*/
#g_navi {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	overflow: auto;
	z-index: 3000;
	background-color: #F2F6F7;
	background-color: rgba(242,246,247,0.85);
	display: none;
	padding-left: 10%;
}
#g_navi ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: column;
    flex-flow: column;
    -webkit-justify-content: center;
    justify-content: center;
    min-height: 100%;
}


#g_navi ul li a {
	color: #111;
	text-decoration: none;
	display: block;
	padding: 10px;
	line-height: 22px;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: 1px;
}
#g_navi ul li a:hover {
	color: #3C5B6F;
}

#g_navi ul li.contact a {
	text-align: center;
	background-color: #3C5B6F;
	color: #FFF;
	width: 90%;
}

#g_navi ul li.contact a:hover {
	background-color: #FFF;
	color: #3C5B6F;
}


/*
メニューシャドウ
-------------------------------------------*/
.bg_bl {
	background-color: #FFF;
	height: 100%;
	width: 100%;
	opacity: 0.80;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
	display: block;
	position: fixed;
	z-index: 2000;
}


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

header {
	height: 52px;
}
header #top_logo a img,
header h1 a img {
        top: 10px;
        left: 10px;
        height: auto;
        width: 48%;
}

header .h_menu {
	display: none;
}

header #info {
	display: none;
}


#sub_top.sample {
	background-image: url(../img/sub_top_sample_sp.jpg);
}
#sub_top.faq {
	background-image: url(../img/sub_top_faq_sp.jpg);
}
#sub_top.contact {
	background-image: url(../img/sub_top_contact_sp.jpg);
}
#sub_top.news {
	background-image: url(../img/sub_top_news_sp.jpg);
}
#sub_top.concept {
	background-image: url(../img/sub_top_concept_sp.jpg);
}
#sub_top.works {
	background-image: url(../img/sub_top_works_sp.jpg);
}
#sub_top.about {
	background-image: url(../img/sub_top_about_sp.jpg);
}


/*
フッター
-------------------------------------------*/
footer {
	border-bottom-width: 60px;
}

footer .cont_wrap .f_box {
	width: 50%;
	text-align: center;
}
footer .cont_wrap .f_box.lg {
	width: 100%;
}

.no_sp {
	display: none;
}

}
/*-- /～960px --*/



/*
無限ループ
-------------------------------------------*/
.loop_wrap_base {
	width: 100%;
	height: auto;
	overflow: hidden;
	background-color: #F2F6F7;
	padding-top: 30px;
	padding-bottom: 30px;
}


.loop_wrap_base h2 {
	font-weight: normal;
	color: #111;
	text-align: center;
	line-height: 1.2;
	padding: 10px;
	font-size: 24px;
}
.loop_wrap_base h2 span {
	letter-spacing: 0.2em;
	font-size: 14px;
	color: #555;
}

.loop_wrap {
  display: flex;
  width: 220%;
  height: auto;
}

.loop_wrap ul {
  width: 100%;
  height: auto;
  display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.loop_wrap ul li {
	width: 20%;
}

.loop_wrap ul li a {
	display: block;
	text-decoration: none;
	color: #555;
	text-align: center;
	line-height: 1.6;
	font-size: 14px;
	position: relative;
}
.loop_wrap ul li a img {
	width: 100%;
	display: block;
	margin-bottom: 5px;
}

.loop_wrap ul li a span {
	display: inline-block;
	background-color: #36BEAD;
	color: #FFF;
	font-size: 12px;
	position: absolute;
	top: 0;
	left: 0;
	padding: 5px;
	letter-spacing: 1px;
	z-index: 10;
}

.loop_wrap ul li a span.cl_2 {
	background-color: #333;
}

.loop_wrap ul li a span.cl_3 {
	background-color: #FF9900;
}

@keyframes loop {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

@keyframes loop2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}

.loop_wrap ul:first-child {
  animation: loop 50s -25s linear infinite;
}

.loop_wrap ul:last-child {
  animation: loop2 50s linear infinite;
}

.loop_wrap:hover ul {
  animation-play-state: paused;
}



/*
SNSボタン
-------------------------------------------*/

.h_sns {
	padding: 5px;
	position: fixed;
	top: 130px;
	right: 0px;
	background-color: rgba(17,187,221,0.8);
	border-radius: 8px 0px 0px 8px;
	-webkit-border-radius: 8px 0px 0px 8px;
	-moz-border-radius: 8px 0px 0px 8px;
	display: none;
}
.h_sns li a {
	display: block;
	padding: 10px;
	color: #FFF;
	line-height: 30px;
	width: 50px;
	text-align: center;
	text-decoration: none;
	font-size: 18px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

.h_sns li a:hover {
	background-color: #FFF;
	color: #3C5B6F;
}


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



#conpanyArea .txt{
   width: 100%;
   margin: 0 0 10px 0;
}
#conpanyArea .img {
    width: 100%;
    margin: 0 0 0 0;
}
#reasonArea .txt {
    width: 100%;
}
#reasonArea .img {
    width: 100%;
    margin: 0 0 10px 0;
}


#index_top #top_catch img {
    width: 100%;
}


#top_visual {
    padding: 100px 0;
}

#index_top {
    height: 50%;
}

.content.movie_blk video{
    display: none;
}

.flexbox {
    display: block;
}

#consept #leftArea{
    width: 90%;
    box-sizing: border-box;
    margin: -100px auto 0 auto;
    padding: 35px 28px;
}

#consept #leftArea h2 {
    font-size: 115%;
    font-weight: bold;
}
#consept #rightArea {
    width: 90%;
    background-color: #fff;
    margin: 0 auto;
}

.content #consept #leftArea p.btn a {
    width: 100%;
}

#consept #rightArea ul {
  width:80%;
  margin: 0 auto;
}

#consept #rightArea ul li:first-child{
 margin: 0;
}
#consept #rightArea ul li:last-child{
 margin: 0 0 0 0;
}

.content h2 span{
  margin: 0 20px 0 0;
}

#joblist {
  padding: 20px;
}

#voice{
  padding: 20px;
}

.content #voice h2 {
  line-height: 1.2;
  font-size:14px;
  margin: 0 0 20px 0;
}
.content #voice h2 span{
  display: block;
  font-size:18px;
}
#incontent img {
    width: 60%;
}
#bnrAera ul li {
margin: 0 0 20px 0; 
}
#bnrAera ul li:last-child {
margin: 0 0 0 0; 
}

#bne2Area{
padding: 20px;
}

#bne2Area ul li {
    margin: 0 0 20px 0;
}
#bne2Area ul li:last-child {
    margin: 0;
}

#saiyoArea #inwrap{
padding: 20px;
}

#saiyoArea .leftArea,
#saiyoArea .rightArea{
width:100%;
}

#saiyoArea .leftArea ul li {
    width: 100%;
    margin: 0 0 20px 0;
}
#saiyoArea .leftArea ul li a:before {
    left: 312px;
}
#saiyoArea .leftArea ul li:last-child a:before {
    left: 310px;
}
#saiyoArea .rightArea ul li a:before {
    right: 74px;
}

#topvmenu li span {
    white-space: nowrap;
}

.parara {
    padding-top: 40%;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
}

    #docsArea .docs, #prosessArea, #event .pieceContainer, #QAcommentArea, #statusArea, #leadArea, #voicepArea, #jpbsArea .cont_wrap, #allsyain {
        padding: 20px 0px;
    }

#topvmenu li {
  margin: 0 0 0 0;
}
#jpbsArea .cont_wrap h2 {
    font-size: 180%;
    margin: 0 0 0 0;
}
.content #jpbsArea p.ttl {
    font-size: 20px;
    margin-top: 0;
}
#jpbsArea .cont_wrap #eigyo {
    margin: 15px;
}
.content #jpbsArea .cont_wrap #eigyo h3 {
    padding: 15px 0 10px 0;
}

#jpbsArea {
    background-color: #fff;
    padding: 0 0 0 0;
}
#conceptMssagesArea {
    width: 100%;
    margin: 0;
    padding: 20px;
}

#conceptMssagesArea h2 {
    font-size: 45px;
    text-align: center;
}

#conceptMssagesArea h3 {
    font-size: 24px;
    text-align: center;
}


#page-recruit-concept-index #top_visual {
        padding: 40px 0;
        background-size: cover;
        background-blend-mode: color-burn;
        background-repeat: no-repeat;
        background-position: -230px;
    }

#conceptArea .prewrap .pre h2 {
    font-size: 170%;
}

#conceptArea .prewrap .come {
    padding: 20px;
    margin: 100px 20px 20px 20px;
}
#conceptArea #works .come h3, #conceptArea #works .pre h3, #conceptArea .prewrap .come h3 {
    font-size: 17px;
    margin: 0 0 10px 0;
}

#conceptArea #works .pre h2 {
    font-size: 200%;
}
#conceptArea #works .pre {
    padding: 40px 20px 20px 20px;
}

#conceptArea #works .come{
    padding: 0 20px 20px 20px;
}
#conceptArea .fuwrap h2 {
    font-size: 200%;
    line-height: 1.6;
}
#futureArea .pre ul li {
    width: 90%;
    margin: 0 auto 20px auto;
    padding: 0;
}
#futureArea .pre ul li:last-child {
    margin: 0 auto 20px auto;
}
#conceptArea .fuwrap {
    padding: 30px 0;
}

#conceptArea .fuwrap h2 {
    margin: 0 0 30px 0;
}

#top_visual p.visualEn {
    font-size: 180%;
}
#shisotsuCyaria {
    padding: 20px;
    margin-bottom:0;
}

#requirementsArea h2 {
    font-size: 140%;
    margin: 0 0 20px 0;
}

#yoko ul ul.flexbox {
        display: flex;
    }
#yoko li {
    width: 100%;
    margin: 0 0 20px 0;
}
#taigu {
    padding: 20px;
}
#faq {
    padding: 20px;
}

#welfareArea {
    padding: 40px 10px 10px 10px;
}
#welfareArea #allsyain h2 {
    font-size: 120%;
}
.content #welfareArea h3 {
    font-size: 24px;
}
.content #welfareArea ul li {
    width: 100%;
    margin: 0 0 20px 0;
    padding: 20px;
}

.content #welfareArea ul {
    padding: 20px;
  margin:  0 20px  20px 20px;
}

.content #welfareArea #shikaku{
  margin:  0 20px  20px 20px;
  width: 89%;
}


.content #welfareArea #shikaku h2 {
    font-size: 130%;
    text-align: center;
}

#event h2, 
#prosessArea h2 {
    margin: 0 auto 30px auto;
    width: 92%;
}
#prosessArea section {
    margin: 0 20px 40px 20px;
}
.content #prosessArea section h3 {
    font-size: 24px;
}
.content #prosessArea section h3 {
    font-size: 15px;
    margin: 0 0 20px 0;
    font-weight: bold;
}

#docsArea.content {
        padding-top: 20px;
        padding-bottom: 20px;
        padding: 20px;
    }

.content .contentGpArticleDoc .date p.publishedAt {
    padding-right: 0;
}
.content .contentGpArticleDoc .date p{
    padding: 0;
    margin: 0;
}

#page-recruit-activity-index #top_visual {
    background: url(/_themes/base2/img/img_ttl_kohara_katsudo.png) #EEE no-repeat center center;
    background-size: contain;
}
#page-recruit-activity-index #top_visual p.visualEn {
    font-size: 18px;
    padding-bottom: 130px;
}
#activityArea ul li{
  width: 100%;
}
#activityArea {
    padding: 0px;
}

#sekkeiDSArea .photo, #gooddArea .flexbox.gallaryArea, #gooddArea .flexbox.gallaryArea, #studuArea .messages, #studuArea .flexbox.gallaryArea {
    padding: 10px;
    margin: 0 0 10px 0;
}

.content #messages h3 {
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 0;
    position: relative;
    padding-top: 15px;
    padding-right: 10px;
    padding-bottom: 0;
    padding-left: 30px;
   font-weight: bold;
}

.content #activityArea h3{
        padding-left: 10px;
        padding-bottom: 0;
        margin: 0 0 10px 0;
        font-weight: bold;
        padding-top: 0;
        padding-right: 0;
        font-size: 22px;
}

.content #activityArea p{
    padding-top: 0;
    margin-top:0;
    margin-left:10px;
    margin-right:0px;
}

.content #activityArea h3:after {
	display: none;
}



#leadArea .left,
#leadArea .right {
  width: 100%;
}

#leadArea p.tit {
    margin: 0 0 10px 0;
}
#leadArea .cont_wrap {
    width: 96%;
}

#gooddArea,
#sekkeiDSArea,
#studuArea {
  margin-bottom:10px;
}
footer .cont_wrap ul {
    padding: 10px;
}

#talkArea #staff4mei .flexbox{
  display: flex;
  flex-wrap: wrap;
}

#page-recruit-talk-index #staff4mei ul li{
    width: 48.2%;
    margin: 0px 10px 10px 0;
}
#page-recruit-talk-index #staff4mei ul li:nth-child(even){
 margin-right:0;
}
#page-recruit-talk-index #staff4mei ul li{
    font-size: 90%;
}

#page-recruit-talk-index .content.welf{
  padding: 0 10px;
}
#page-recruit-talk-index #staff4mei ul li:last-child{
   margin-bottom: auto;
}

#page-recruit-talk-index #menuList li {
        width: 80%;
        margin: 0 auto 20px auto;
}
#page-recruit-talk-index .content h2 span {
        margin: 0 0 0 0;
    }
#takeStaffArea #menuList {
    background-color: #F6D13B;
    border-radius: 15% 15% 0 0;
    padding: 50px 0 50px 0;
}

#wrap #icontalKArea .flexbox .flexbox{
  display: flex;
}

.flexbox.talkspeace .stimg{
  width: 30%;
}

.flexbox.talkspeace .txt{
  width: 70%;
}
#bottomArea {
    padding: 0 0 50px 0;
    margin: 0 0 50px 0;
}

#btncary li {
  width: 80%;
  margin: 0 auto 20px auto;
}
#btncary li:last-child {
  margin: 0 auto 20px auto;
}

#leadArea .naiyou {
    border-radius: 5px;
}
#statusArea{
  margin: 0 10px;
}

#QAcommentArea,
#statusArea {
        margin: 0 10px 40px 10px;
        width: 95%;
}
#statusArea h2 {
    margin: 0 0 0 0;
}
#statusArea ul.flexbox {
     display: flex;
     flex-wrap: wrap;
     padding: 0 20px 0px 20px;
}
#statusArea ul.flexbox li{
        width: 48.2%;
        margin: 0px 10px 10px 0;
}
#statusArea ul.flexbox li:nth-child(even){
     margin-right:0;
}

#QAcommentArea{
  height: 3574px;
}

#QAcommentArea #clm02 .qac{
  top:338px;
}
#QAcommentArea #clm02 figure{
  top:144px;
}
#QAcommentArea #clm03 .qac{
  top:418px;
}
#QAcommentArea #clm03 figure{
  top:224px;
}
#QAcommentArea #clm04 .qac{
  top:517px;
}
#QAcommentArea #clm04 figure{
  top:333px;
}

#QAcommentArea #clm05 .qac{
  top:645px;
}
#QAcommentArea #clm05 figure{
  top:461px;
}

#QAcommentArea #clm06 .qac{
  top:714px;
}
#QAcommentArea #clm06 figure{
  top:530px;
}



#QAcommentArea .qac {
    position: absolute;
    z-index: 10000;
    width: 90%;
    padding: 15px;
    top: 200px;
}

.content #QAcommentArea .qac h3 {
        padding: 0;
        margin-bottom: 14px;
        font-size: 19px;
        font-weight: bold;
}

.content #QAcommentArea .qac p {
    line-height: 1.8;
    margin: 0;
}

#QAcommentArea #clm05 figure, #QAcommentArea #clm03 figure, #QAcommentArea #clm01 figure {
    width: 90%;
}
#QAcommentArea #clm06 figure, #QAcommentArea #clm04 figure, #QAcommentArea #clm02 figure {
    width: 90%;
}
#QAcommentArea #clm05 .qac, #QAcommentArea #clm03 .qac, #QAcommentArea #clm01 .qac {
    left: 15px;
}
#QAcommentArea #clm06 .qac, #QAcommentArea #clm04 .qac, #QAcommentArea #clm02 .qac {
    right: 15px;
}

#spimg{
  background-color: #3472a9;
  text-align: center;
}
#spimg figure img {
    width: 60%;
    height: auto;
}
.sp_hide{
  display: none;
}

#g_navi ul li.sp_show,
.sp_show{
  display: block;
}
.topcon .cont_wrap.effect.flexbox{
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

.topcon .cont_wrap.effect.flexbox .rightArea, .topcon .cont_wrap.effect.flexbox .leftArea {
    width: 100%;
}
.topcon .cont_wrap.effect.flexbox .leftArea h2 span {
    font-size: 92%;
}
.topcon .cont_wrap.effect.flexbox .leftArea figure {
    margin-top: -5px;
    margin-left: 20px;
    width: 50%;
    margin-bottom: 20px;
}

.topcon .cont_wrap.effect.flexbox .rightArea figure{
        position: absolute;
        margin-top: -345px;
        margin-left: 190px;
        width: 50%;
        z-index: -500;
}

#cstory02, #cstory01 {
    width: 90%;
    margin: 0 auto;
}
#cstory02 .leftArea, #cstory01 .leftArea {
    width: 100%;
}
#cstory02 .rightArea, #cstory01 .rightArea {
  width: 90%;
  margin: 0 auto;
    width: 100%;
}

.content #photo-graf02 h3, .content #photo-graf01 h3 {
    font-size: 25px;
    margin-left: 0;
}

#episodeAera01 #no01 .flexbox .img{
    position: absolute;
    right: 20px;
    z-index: -9;
    width: 56%;
    top: -160px;
}

.episodeArea .ep h5 {
    font-size: 19px;
}

#progress02,
#progress01,
#episodeAera02,
#episodeAera01 {
  width: 90%;
  margin: 0 auto;
}



.content .progressArea .leftArea{
  width: 100%;
}
.content .progressArea .rightArea{
  width: 100%;
  margin: 0 0 20px 0;
}


#progressArea .flexbox{
        position: relative;
}
.content #progress01.progressArea .rightArea img {
position: absolute;
    top: 4358px;
    width: 210px !important;
    z-index: 0;
    right: 32px;
}

#episodeAera02 #no04 .flexbox .img{
        right: 0;
        z-index: -9;
        width: 60%;
        top: -160px;
}

#episodeAera02 #no04 .flexbox .img img{
    width: 100%!important;
    height: auto!important;
}


.content #progress02.progressArea .rightArea img {
        position: absolute;
        top: 18px;
        width: 210px !important;
        z-index: 0;
        right: 17px;
}

.content .ep h4{
    position: unset;
}

.content .ep h4 .eps{
   position: unset;
}

.content .ep h4 span{
  display: block;
  width: 100%;
}
#btncary li:first-child a:before {
    left: 270px;
}
#btncary li:last-child a:before {
    left: 270px;
}












.h_sns {
	width: 100%;
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	top: auto;
	bottom: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
	padding-right: 60px;
}

.h_sns li {
	width: 25%;
}
.h_sns li a {
	width: 100%;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
	
#index_top #top_catch {
	top: 45%;
	left: 5%;
	width: 90%;
	height: 50%;
	margin-top: 0px;
	margin-left: 0px;
}


#index_top #top_catch h2 {
	font-size: 40px;
}

#index_top #top_catch p {
	font-size: 12px;
}

#sub_top {
	height: 180px;
	padding-top: 100px;
}

.content p {
	padding-bottom: 0;
	margin: 0px;
        line-height: 1.6;
}

.img_left,
.img_right {
	float: none;
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	max-width: 100%;
}

.pick_up ul li {
	width: 100%;
}

.content .ul_news li span.date {
	padding-right: 0px;
	display: block;
}

.obi_001 {
	background-image: url(../img/obi_001_sp.jpg);
	padding-left: 10px;
	padding-right: 10px;
}

.obi_001 p {
	text-align: left;
	margin-left: 15px;
	margin-right: 15px;
	font-size: 14px;
}

.obi_002 {
	background-image: url(../img/obi_002_sp.jpg);
	padding: 0 0 100%;
}

.loop_wrap {
  width: 400%;
}

.box_cont .body {
	padding-right: 10px;
	padding-left: 10px;
}

.box_cont .body .box_c_in {
	width: 100%;
	padding: 5px;
}

.content .cont_wrap .txt_box {
	margin-left: 0px;
	margin-right: 0px;
}

/*----------------767px---------------------*/
}

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

input,
textarea {
	max-width: 300px !important;
}

.content table.table_01 th,
.content table.table_01 td {
	width: 100% !important;
	display: block;
}

.content table.table_01 th {
	background-color: #F6F6F6;
}


#index_top #top_catch h2 {
	font-size: 30px;
}

#sub_top {
	font-size: 24px;
}

.content h2 {
	font-size: 24px;
}

.content .obi_001 h2 {
	font-size: 22px;
}
/*----------------460px---------------------*/
}

/*
エフェクト
-------------------------------------------*/
.effect {
	opacity: 0;
	filter: alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
	transform: translateY(20px);
	-webkit-transform: translateY(20px);  
    -moz-transform: translateY(20px); 
	-webkit-transition: 1.0s ease-out;
	-moz-transition: 1.0s ease-out;
	transition: 1.0s ease-out;
}
.effect.d_02 {
transition-delay:0.2s;
-webkit-transition-delay:0.2s;
}
.effect.d_04 {
transition-delay:0.4s;
-webkit-transition-delay:0.4s;
}
.effect.d_06 {
transition-delay:0.6s;
-webkit-transition-delay:0.6s;
}
.effect.d_08 {
transition-delay:0.8s;
-webkit-transition-delay:0.8s;
}
.effect.start {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	transform: translateY(0px);
	-webkit-transform: translateY(0px);  
    -moz-transform: translateY(0px);    
}


/*------------------------------*/

 
.obi_002 .box_in p a.tel {
	font-size: 24px;
	color: #FFF;
	text-decoration: none;
	line-height: 1.2;
}
.obi_002 .box_in p a.tel strong {
	padding-left: 10px;
	font-size: 150%;
}



.content .box_att {
	margin-top: 30px;
}

.content .box_att h2 {
	font-weight: normal;
	font-size: 24px;
	color: #3EADBD;
	padding: 15px;
	border-bottom-color: #8ED1DB;
}
.content .box_att p {
	font-size: 14px;
	margin: 0px;
	color: #328B98;
}


/*
FAQ
-------------------------------------------*/
dl.faq {
	display: block;
	margin: auto;
	width: 90%;
}

dl.faq dt {
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "Sawarabi Mincho", "HG明朝E",  "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size: 20px;
	color: #FFF;
	background-color: #278498;
	display: block;
	position: relative;
	width: 80%;
	margin-left: 20%;
	margin-bottom: 20px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 50px;
}

dl.faq dt::before{
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ ゴシック", "MS Gothic", sans-serif;
	font-size: 24px;
	content: "Q.";
	position: absolute;
	left: 20px;
	top: 13px;
}
dl.faq dt::after{
    border: solid transparent;
    content:'';
    height:0;
    width:0;
    pointer-events:none;
    position:absolute;
    border-color: rgba(39, 132, 152, 0);
    border-top-width:16px;
    border-bottom-width:16px;
    border-left-width:8px;
    border-right-width:8px;
    border-bottom-color:#278498;
    bottom:100%;
    right:30px;
}
dl.faq dd {
	font-size: 16px;
	background-color: #FFF;
	display: block;
	position: relative;
	width: 80%;
	padding: 20px;
	margin-bottom: 50px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	-moz-box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 5px 0px;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 50px;
}
dl.faq dd::after{
	border: solid transparent;
	content: '';
	height: 0;
	width: 0;
	pointer-events: none;
	position: absolute;
	border-color: rgba(255,255,255,0.0);
	border-top-width: 16px;
	border-bottom-width: 16px;
	border-left-width: 8px;
	border-right-width: 8px;
	border-bottom-color: #FFFFFF;
	bottom: 100%;
	left: 30px;
}

dl.faq dd::before{
	font-size: 24px;
	content: "A.";
	position: absolute;
	left: 20px;
	top: 13px;
}


/*
事例一覧＆ギャラリー
-------------------------------------------*/

.works_list li {
	display: block;
	float: left;
	width: 25%;
	padding: 20px;
}

.works_list li a {
	display: block;
	text-decoration: none;
	width: 100%;
	padding: 10px;
	border: 1px solid #F2F6F7;
	position: relative;
}

.works_list li a:hover {
	background-color: #FFF;
	border: 1px solid #DDE7EA;
}

.works_list li a span {
	display: block;
	color: #FFF;
	font-size: 12px;
	background-color: #36BEAD;
	position: absolute;
	top: 5px;
	left: 5px;
	z-index: 10;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
}

.works_list li a span.cl_2 {
	background-color: #333333;
}

.works_list li a span.cl_3 {
	background-color: #FF9900;
}

.works_list li a img {
	width: 100%;
	height: 180px;
	object-fit: cover;
}

.works_list li a p {
	color: #111;
	text-align: center;
	margin: 0px;
}

.g_list li {
	display: block;
	float: left;
	width: 20%;
	padding: 20px;
}

.g_list li a {
	display: block;
	width: 100%;
	height: 150px;
	overflow: hidden;
}

.g_list li a img {
	width: 100%;
	height: 150px;
	object-fit: cover;
}

.g_list li a img:hover {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}


/*
Facebook
-------------------------------------------*/
/*---
.content .cont_wrap .box_left {
	width: 50%;
	float: left;
	padding: 10px;
}
.content .cont_wrap .box_right {
	width: 50%;
	float: right;
	text-align: center;
	padding-right: 10px;
	padding-bottom: 20px;
	padding-left: 10px;
}-----*/




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

.content .cont_wrap .box_left {
	width: 100%;
	float: none;
}
.content .cont_wrap .box_right {
	width: 100%;
	float: none;
	overflow: hidden;
}

.content .cont_wrap .box_right .fb-page {
	width: 100% !important;
}

.works_list li {
	width: 33.33%;
}

.g_list li {
	width: 33.33%;
}
/*----------------960px--------------------*/
}

/*
ページャー
-------------------------------------------*/

.pager {
	padding-top: 50px;
	padding-bottom: 50px;
	clear: both;
}

.pager .pagination {
  text-align: center;
}

.pager .pagination li {
	display: inline;
	margin: 0 2px;
	padding: 0;
	display: inline-block;
	width: 36px;
	height: 36px;
	text-align: center;
	position: relative;
}


.pager .pagination li a{
	vertical-align: middle;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	display: table;
	color: #FFF;
	text-decoration: none;
	background-color: #333333;
}

.pager .pagination li a span{
  display:table-cell;
  vertical-align:middle;
}

.pager .pagination li a:hover,
.pager .pagination li a.active{
	color: #000;
	background-color: #F9F9F9;
}

@media only screen and (max-width: 767px){
.pager {
	padding-top: 20px;
	padding-bottom: 20px;
}
  .pager .pagination li{
    display: none;
  }

  .pager .pagination li.pre,
  .pager .pagination li.next{
    display: inline-block;
    width: 40%;
    height: 40px;
    text-align: center;
  }

  .pager .pagination li.pre a,
  .pager .pagination li.next a{
    width: 100%;
    text-align: center;
  }

  .pager .pagination li.pre span::after{
    content: "　前の10件へ";
  }

  .pager .pagination li.next span::before{
    content: "次の10件へ　";
  }
  
  .works_list li {
	width: 50%;
	padding: 10px;
}

.g_list li {
	width: 50%;
}

.img_center span {
	font-size: 14px;
	padding: 5px;
}

.img_center div {
	font-size: 12px;
	padding: 20px;
}

dl.faq {
	width: 96%;
}

dl.faq dt {
	font-size: 18px;
	width: 90%;
	margin-left: 10%;
}

dl.faq dd {
	width: 90%;
}

/*-------------------
zomeki sp
------------------*/

/*------top----------*/

.content {
  width: 100%;
  padding: 0 2% 2% 2%;
}

.content #reasonArea h3, 
.content #conpanyArea h3{
    font-size: 26px;
    margin: 0 0 10px 0;
}

#newslist h2, #ulResult h2, .topv .txt p.ttl, #reasonArea h2, #conpanyArea h2, .baskervville {
    font-size: 28px;
}
.topv .txt p.ttl span {
    font-size: 20px;
}
.topv .txt p.con {
    font-size: 16px;
    line-height: 1.4;
}

.topv .piece .flexbox .img {
        width: 90%;
        position: static;
}



.leftAre, .rightArea {
  width: 100%;
  padding: 0 2%;
}
footer .f_box ul,
footer .f_box dl{
  display: none;
}

#ulResult ul#whatsnew li {
    flex-basis: calc(48.9% - 7px);
    margin: 0 4px;
}

.content #works #worksNavi dd {
    margin: 0 0 20px 0;
}

.content #works #worksNavi dd .submitters input {
    padding: 4px 20px;
    margin: 0 0 0 10px;
}

#works #worksNavi h2 {
    font-size: 48px;
}
#works #worksNavi h2 span {
    font-size: 24px;
}
.leftAre ul li img {
    width: 100%;
}

footer .cont_wrap p.address{
  border: none;
}

footer p.top{
  display: none;
}

.cont_wrap .f_box{
  display: none;
}

.tnav li.tel{
  display: none;
}

.cont_wrap .f_box.lg{
  display: block;
}
#g_navi ul{
        display: -webkit-flex;
        display: flex;
        -webkit-flex-flow: column;
        flex-flow: column;
        -webkit-justify-content: center;
        justify-content: center;
        min-height: 0;
        margin: 20px 20px 0 0;
}

.content #works #worksNavi .jigyonoto {
    margin: 0 0 20px 0;
}
/*------top----------*/

/*------kaso----------*/
#breadCrumbs{
  display: none;
}

header .h1 a img, header h1 a img {
    width: 230px;
}

#pageArea{
  padding-top: 10px;
  padding-bottom: 20px;
}
.content h1 {
    line-height: 1.5;
    font-size: 22px;
    margin-bottom: 20px ;
}

ul li h2 {
    background: url(/_themes/base/img/img_icon_koro.png) no-repeat left center;
    background-size: 40px;
    padding: 13px 20px 13px 50px;
    font-size: 170%;
    margin: 0 0 20px 0;
}

.topv .piece .flexbox .txt {
    width: 90%;
    z-index: 1000;
    padding: 10px ;
    position: static;
}
.topv .piece .flexbox .txt  p.con{
  display: none;
}


.topv {
    padding: 50px 0 0 0;
}

#g_navi ul{
 min-height: 0%;
}

#submenu{
  display: none;
}

.bussinessPage .flexbox {
    padding: 0 0 40px 0;
    margin: 0 0 0 0;
}

.bussinessPage .flexbox{
    display: flex;
}
.bussinessPage .txt {
    width: 100%;
}
.bussinessPage figure {
    width: 100%;
}
/*-------------------

#page-navi-index .topv .piece .flexbox .img {
        width: 90%;
}
#page-about-index .topv .piece .flexbox .img,
#page-privacy-index .topv .piece .flexbox .img,
#page-Smartphone-contact-form-index .topv .piece .flexbox .img {
        top: 100px;
    }

.catewrap .topv .piece .flexbox .img,
#page-navi-index .topv .piece .flexbox .img {
        top: 140px;
}
#page-business-shop #pageArea ,
#page-business-kaichiku #pageArea ,
#page-business-shinchiku #pageArea ,
#page-business-bosui #pageArea ,
#page-business-toso #pageArea ,
#page-business-index #pageArea{
padding-top: 500px;
}

#page-corpinfo-access .topv .piece .flexbox .img,
#page-corpinfo-history .topv .piece .flexbox .img,
#page-corpinfo-philosophy .topv .piece .flexbox .img,
#page-corpinfo-advantage .topv .piece .flexbox .img,
#page-corpinfo-greeting .topv .piece .flexbox .img,
#page-corpinfo-index .topv .piece .flexbox .img {
        top: 320px;
}

#page-category-blog-index #pageArea {
        padding-top: 10px;
}

#page-corpinfo-access #pageArea,
#page-corpinfo-history #pageArea,
#page-corpinfo-philosophy #pageArea,
#page-corpinfo-advantage #pageArea,
#page-corpinfo-greeting #pageArea,
#page-corpinfo-index #pageArea {
        padding-top: 470px;
}

#page-about-index #pageArea,
#page-privacy-index #pageArea,
#page-Smartphone-contact-form-index #pageArea {
        padding-top: 240px;
}
--------------*/



.catewrap #pageArea,
#page-navi-index #pageArea {
        padding-top: 20px;
}

.corpinfoPage .flexbox,
.bussinessPage .flexbox {
  display:flex;
  flex-flow: column;
  text-decoration: none;
}
.effect.start#con06 figure,
.effect.start#con04 figure,
.effect.start#con02 figure{
  order: 1;
}
.effect.start#con06 .txt,
.effect.start#con04 .txt,
.effect.start#con02 .txt{
  order: 2;
}
.bussinessPage .txt p {
    margin: 70px;
}

.bussinessPage #con01 .txt {
    background: url(/_themes/base/img/img_bg_bu01.webp) no-repeat center bottom;
    background-size: 100%;
    padding: 0 0 30px 0;
}
.bussinessPage #con02 .txt {
    background: url(/_themes/base/img/img_bg_bu02.webp) no-repeat center bottom;
    background-size: 100%;
    padding: 0 0 30px 0;
}
.bussinessPage #con03 .txt {
    background: url(/_themes/base/img/img_bg_bu03.webp) no-repeat center bottom;
    background-size: 100%;
    padding: 0 0 30px 0;
}
.bussinessPage #con04 .txt {
    background: url(/_themes/base/img/img_bg_bu04.webp) no-repeat center bottom;
    background-size: 100%;
    padding: 0 0 30px 0;
}
.bussinessPage #con05 .txt {
    background: url(/_themes/base/img/img_bg_bu05.webp) no-repeat center bottom;
    background-size: 100%;
    padding: 0 0 30px 0;
}


.corpinfoPage figure {
    width: 100%;
}
.corpinfoPage #con01 .txt{
    width: 100%;
}
.corpinfoPage .txt p {
    margin: auto;
}
.corpinfoPage .txt {
    width: 100%;
    padding: 40px 0;
}


.corpinfoPage #con01 .txt {
    background: url(/_themes/base/img/img_bg01i.png) no-repeat center bottom;
    background-size: 100%;
    padding: 80px 0 30px 0;
}
.corpinfoPage #con02 .txt {
    background: url(/_themes/base/img/img_bg02i.png) no-repeat center bottom;
    background-size: 100%;
    padding: 80px 0 30px 0;
}
.corpinfoPage #con03 .txt {
    background: url(/_themes/base/img/img_bg03i.png) no-repeat center 30px;
        background-size: 100%;
        padding: 80px 0 50px 0;
}
.corpinfoPage #con04 .txt {
    background: url(/_themes/base/img/img_bg04i.png) no-repeat center 30px;
        background-size: 100%;
        padding: 80px 0 50px 0;
}
.corpinfoPage #con05 .txt {
    background: url(/_themes/base/img/img_bg05i.png) no-repeat center 30px;
        background-size: 100%;
        padding: 80px 0 50px 0;
}
.corpinfoPage #con06 .txt {
    background: url(/_themes/base/img/img_bg06i.webp) no-repeat center 30px;
        background-size: 100%;
        padding: 80px 0 50px 0;
}

#greetingArea .txt {
    width: 100%;
    margin: 20px 0 0 0;
}
#greetingArea figure {
    width: 100%;
}

#advantageArea figure {
    width: 100%;
    margin: 0 0 20px 0;
}

#advantageArea .txt {
    width: 92%;
    margin: 0 auto;
}

#contentArea .body .text-beginning h2,
#contArea .clm h2, ul li h2{
   font-size: 24px;
   line-height: 1.2;
   margin: 0 0 20px 0;
    background-size: 10%;
    padding: 12px 20px 12px 50px;
    }

.content .bg-dark p {
 text-align: left;
}

#contArea .clm h2, ul li h2 {
        background-size: 12%;
        padding: 20px 20px 20px 62px;
        font-size: 170%;
}

.content #advantageArea p.point{
  margin: 0 0 20px 0;
}

#advantageArea .flexbox {
    margin: 10px 0 20px 0;
}

#page-corpinfo-philosophy .content h2 {
        font-size: 22px;
        margin: 0;
}

.is-style-whiteboard1 {
    padding: 1.1em 0.2em;
}

ul.timeline-list-alternate {
    padding: 14px 14px 56px 14px;
}
ul.timeline-list-alternate li:nth-of-type(odd) {
    padding-left: 0.5rem;
    padding-right: 2rem;
}
ul.timeline-list-alternate li:nth-of-type(even) {
    padding-left: 1rem;
}

#accessArea .rightArea, #accessArea .leftArea {
    width: 100%;
    margin: 0 0 20px 0;
}
#accessArea h2 {
    background: url(/_themes/base/img/img_icon_koro.png) no-repeat left center;
    background-size: 12%;
    padding: 0px 20px 10px 50px;
    font-size: 137%;
}
#infoArea #info #blogArea p.ttl strong {
    font-size: 20px;
}

#infoArea #info #blogArea .ttl stong,
#infoArea #info #blogArea .ttl span {
    display: block;
    font-size: 12px;
    margin: -7px 0 0 0;
}
#infoArea #info #blogArea p.ttl img {
    margin: 0 0 0 24px;
}

#contentArea.flexbox .mainArea {
    width: 100%;
}
#contentArea.flexbox .subArea {
    width: 100%;
}

#contentArea.flexbox .subArea h2 {
    padding: 10px;
}

.categoryType h2 a, .contentGpCategoryCategoryType h2 a {
    background-size: 9%;
    padding: 5px 20px 5px 30px;
}
.docs h2.date {
    background-size: 9%;
    padding: 5px 20px 5px 30px;
}
.answer_content {
    width: 100%;
    float: none;
    border: none;
    padding-top: 0;
}

.question_content {
    width: 100%;
    float: none;
    margin: 0;
    padding: 10px 0;
}

#page-privacy-index .content h2 {
        font-size: 20px;
}

.catewrap .contentGpCategoryCategory .docs li .title_link, 
.catewrap .contentGpCategoryCategoryType .docs li .title_link,
.catewrap .categoryType .docs li .title_link, 
.catewrap .contentGpArticleDocs .docs li .title_link {
    font-size: 125%;
    line-height: 1.6;
    margin: 0 0 20px 0;
}

.catewrap .contentGpCategoryCategory .image,
.catewrap .contentGpCategoryCategoryType .image,
.catewrap .categoryType .image,
.catewrap .contentGpArticleDocs .image {
    display: block;
    float: left;
    margin: 0 4px 4px 4px;
    overflow: hidden;
    width: 130px;
}
.resultdocsArea #lead figure {
    width: 100%;
    margin: 0 0 20px 0;
}
.resultdocsArea #lead .txt {
    width: 100%;
}
#contentArea.flexbox .mainArea .clm h2 {
    background-size: 11%;
    padding: 13px 11px 13px 38px;
    font-size: 140%;
    margin: 0 0 30px 0;
}

#gal .flexbox li {
    width: 100%;
    margin: 0 0 20px 0;
}


#footerSubmenu {
  --border-color: #111111;
  --background-color:#284780;
  --hover-background-color:#3d6abc;
  --text-color:#fff;
  --font-size:20px;
  width:100%;
  box-sizing:border-box;
  font-size:var(--font-size);
}

  #footerSubmenu >ul{
    list-style:none;
    margin:0;
    padding:0;
    border:1px solid var(--border-color);
    border-radius:0.25em;
    background:var(--background-color);
  }
   #footerSubmenu >ul>li{
      border-bottom:1px solid var(--border-color);
    }
   #footerSubmenu >ul>li:last-child{
      border-bottom:none;
      border-radius:0 0 0.5em 0.5em;
    }
   #footerSubmenu >ul>li:first-child{
      border-radius: 0.5em 0.5em 0 0;
    }
    #footerSubmenu >ul>li:hover{
      background:var(--hover-background-color);
    }
    #footerSubmenu >ul>li>a{
        display:block;
        padding:0.25em 0.5em;;
        text-decoration:none;
        color:var(--text-color);
        width:auto;
        position:relative;
      }

     #footerSubmenu >ul>li>a:after{
        content:">";
        position:absolute;
        text-align:right;
        color:var(--text-color);
        right:1em;
        top:50%;
        transform:translateY(-50%);
      }

#footerSubmenu{
  display: block;
}
#greetingArea .txt h2 {
    font-size: 147%;
    line-height: 1.4;
    margin: 0 0 20px 0;
}

.table th{
  padding: 0.2em;
}


















/*---------767px---------------*/
}


/*---------768-1023--------*/
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    header #top_logo a img, header h1 a img {
        width: 25%;
    }


.content {
    width: 100%;
    padding: 10px 2% 80px  2%;
}
    #g_navi ul {
        min-height: 10%;
    }
footer .f_box{
  display: none;
}

footer .f_box.lg{
  display: block;
}
footer .cont_wrap .f_box.lg {
        width: 100% !important;
        margin: 0 0 30px 0;
}

#footer_logo a{
  display: block;
  width: 300px;
  margin: 0 auto;
}

footer .cont_wrap p.address{
  border: none;
}

.topv .piece .flexbox .txt {
    width: 50%;
    padding: 15px;
}

.topv .txt p.con{
  display: none;
}
#submenu ul li {
    font-size: 14px;
}
#submenu ul {
    width: 94%;
}



.bussinessPage #con01 .txt {
    background: url(/_themes/base/img/img_bg_bu01.webp) no-repeat center 100px;
    background-size: 84%;
}
.bussinessPage #con02 .txt {
    background: url(/_themes/base/img/img_bg_bu02.webp) no-repeat center 100px;
    background-size: 84%;
}
.bussinessPage #con03 .txt {
    background: url(/_themes/base/img/img_bg_bu03.webp) no-repeat center 100px;
    background-size: 84%;
}
.bussinessPage #con04 .txt {
    background: url(/_themes/base/img/img_bg_bu04.webp) no-repeat center 100px;
    background-size: 84%;
}
.bussinessPage #con05 .txt {
    background: url(/_themes/base/img/img_bg_bu05.webp) no-repeat center 100px;
    background-size: 84%;
}



#footerSubmenu {
  --border-color: #111111;
  --background-color:#284780;
  --hover-background-color:#3d6abc;
  --text-color:#fff;
  --font-size:20px;
  width:100%;
  box-sizing:border-box;
  font-size:var(--font-size);
}

  #footerSubmenu >ul{
    list-style:none;
    margin:0;
    padding:0;
    border:1px solid var(--border-color);
    border-radius:0.25em;
    background:var(--background-color);
  }
   #footerSubmenu >ul>li{
      border-bottom:1px solid var(--border-color);
    }
   #footerSubmenu >ul>li:last-child{
      border-bottom:none;
      border-radius:0 0 0.5em 0.5em;
    }
   #footerSubmenu >ul>li:first-child{
      border-radius: 0.5em 0.5em 0 0;
    }
    #footerSubmenu >ul>li:hover{
      background:var(--hover-background-color);
    }
    #footerSubmenu >ul>li>a{
        display:block;
        padding:0.25em 0.5em;;
        text-decoration:none;
        color:var(--text-color);
        width:auto;
        position:relative;
      }

     #footerSubmenu >ul>li>a:after{
        content:">";
        position:absolute;
        text-align:right;
        color:var(--text-color);
        right:1em;
        top:50%;
        transform:translateY(-50%);
      }

#footerSubmenu{
  display: block;
}
.corpinfoPage .txt p {
    margin: 70px;
}
#philosophyArea h2, .wf-sawarabimincho {
    font-size: 48px;
}


table.table,
#historyArea{
  margin:  0 0 40px 0;
}
#infoArea #info #blogArea .ttl {
    top: 20%;
}
#infoArea #info #blogArea p.ttl img {
    margin: 0px 0 0 50px;
}
#contentArea.flexbox .subArea h2 {
    font-size: 100%;
}

.categoryType h2 a, .contentGpCategoryCategoryType h2 a {
    background: url(/_themes/base/img/img_icon_koro.png) no-repeat left center;
    background-size: 8%;
}

#contentArea.flexbox .mainArea {
    width: 68%;
}
#contentArea.flexbox .subArea {
    width: 29%;
}
.contentGpCategoryCategory .image, .contentGpCategoryCategoryType .image, .categoryType .image, .contentGpArticleDocs .image {
    width: 200px;
}
header .h1 a img, header h1 a img {
    width: 200px;
    top: 14px;
}

#newslist h2, #ulResult h2, .topv .txt p.ttl, #reasonArea h2, #conpanyArea h2, .baskervville {
    font-size: 36px;
}

.topv {
    padding: 50px 0 0 0;
}






.leftAre ul li {
    flex-basis: calc(52.5% - 15px);
}
#ulResult ul#whatsnew li {
    flex-basis: calc(24.2% - 7px);
}



  #conseptArea .flexbox {
 display: block;
}
#conseptArea #rightArea ul.flexbox {
 display: flex;
  justify-content: center;
  align-items: center;
}

#consept #leftArea{
        width: 96%;
        margin: -150px auto 0 auto;
        box-sizing: border-box;
}
#consept #rightArea{
    width: 100%;
}
.content #consept #leftArea p.btn a {
    width: 100%;
} 

#joblist ,
#newslist{
        width: 96%;
        margin: 0 auto;
        box-sizing: border-box;
}
#newslist{
        margin-bottom: 20px;
}
#voice {
    padding: 40px;
}
#bne2Area {
    padding: 80px 40px;
}
#saiyoArea .flexbox{
  display: block;
}
#saiyoArea #inwrap {
    padding: 80px 40px;
}
#saiyoArea .leftArea,
#saiyoArea .rightArea{
width:100%;
}
#saiyoArea .leftArea ul li {
    width: 100%;
    margin: 0 0 20px 0;
}
#saiyoArea .leftArea ul li a:before {
    left: 472px;
}
#saiyoArea .leftArea ul li:last-child a:before {
    left: 472px;
}
#saiyoArea .rightArea ul li a:before {
    right: 200px;
}



#docsArea .docs, #prosessArea, #event .pieceContainer, #leadArea, #voicepArea, #jpbsArea .cont_wrap, #allsyain {
    width: 96%;
    padding: 40px 20px;
box-sizing: border-box;
}
#statusArea{
   width: 95%;
        padding: 20px 20px;
        box-sizing: border-box;
}
#QAcommentArea {
    width: 100%;
    padding: 40px 20px;
    box-sizing: border-box;
}

#conceptMssagesArea {
    width: 65%;
    margin: 0 0 0 30%;
}
#page-recruit-concept-index #top_visual {
    background-position: bottom;
}
#conceptArea .prewrap .come {
    width: 96%;
    margin: 0 auto;
}
#leadArea{
    padding: 30px 0 0 0;
    box-sizing: content-box;
    width: 100%;
}
#voicepArea{
    box-sizing: content-box;
    width: auto;
}

#leadArea .cont_wrap {
    width: 95%;
}

.content .surveyForm .body p{
    width: 90%;
    margin: 0 auto;
}
.item-front, .item-back {
    height: 500px;
}
#page-recruit-talk-index #staff4mei {
    width: 96%;
}

/*------------------end----------------*/
}


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

.content {
    padding: 40px 2%  2% 2%;
}

.leftAre ul li img {
    width: 100%;
}
#newslist h2, #ulResult h2, .topv .txt p.ttl, #reasonArea h2, #conpanyArea h2, .baskervville {
    font-size: 70px;
}
.topv .txt p.con {
    font-size: 16px;
}
#submenu ul {
    width: 95%;
}

.topv .txt p.ttl span {
    font-size: 20px;
    margin: 5px 0 0 0;
}

footer .cont_wrap p.address {
    border-bottom: none;
}

/*--kokomade--------------------*/

#g_navi ul li.sp_show,
.sp_show{
  display: none;
}
    #g_navi li a {
        font-size: 13px;
    }
/*------------------1024px----------------*/
}