@charset "utf-8";
/* CSS Document */
/* ---reset------------------------------------------ */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,p,blockquote,section,nav,header,footer{margin:0;padding:0;}ul li,ol li {list-style:none;} h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;}input,textarea,select{ font-family: inherit;font-size:inherit; font-weight:inherit;}input,textarea,select{ *font-size:100%;}a img { border:none;}

* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;}
/* ---common----------------------------------------- */
.cf:before,.cf:after {content: " "; display: table;}.cf:after {clear: both;}.cf {*zoom: 1;}
.alpha a:hover img {opacity: 0.8;filter: alpha(opacity=80);-ms-filter: "alpha(opacity=80)";}
img {border: 0px; vertical-align: bottom;}

#pagetop {position:fixed;bottom:50px;right: 50px;}
#pagetop a {color: #FFF;padding: 2em 1em;text-align: center;font-size: 0.75em;text-decoration: none;border-radius: 6px; }
#pagetop a:hover {opacity: 0.8;-ms-filter: "alpha(opacity=80)";filter: alpha(opacity=80);}
/*pagetop float*/

.ggmap {position: relative;padding-bottom: 75%;padding-top: 30px;height: 0;overflow: hidden;}
.ggmap iframe,
.ggmap object,
.ggmap embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

.brsp {display:none;}

.pc {display: block;} 
.sp {display: none;}

.flexBox {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
			flex-wrap: wrap;
	-webkit-justify-content: space-between;
			justify-content: space-between;
}

body {
	font-size: 14px;
	color: #1F1F1F;
	font-family: "Lucida Grande", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, "メイリオ", sans-serif;
	background: #ffffff;
}

a:link {
color: #005BAB;
}

a:visited {
color: #005BAB;
}

a:hover {
color: #00A3D9;
text-decoration:underline;
}

a:active {
color: #00A3D9;
}

table {
	border: 0;
	border-spacing: 0;
	border-collapse: collapse;
}

img {image-rendering: -webkit-optimize-contrast;}

.inner {
	margin: 0 auto;
	width: 100%;
	max-width: 1000px;
}

header.pc {
	padding: 5px 0 4px;
	height: 36px;
	background: #111111;
	border-bottom: 6px solid #00aa95;
}

header.pc .inner {
	margin: 0 auto;
}

header.pc .logoArea , .fix-header .logoArea {
	margin: 0 0 0 auto;
	width: 180px;
}


/* -------------------------------------------------- */
/* ----header nav------------------------------------ */
header.pc ul li a {
	font-size: 18px;
	color: #111111;
	text-decoration: none;
}


/* -------------------------------------------------- */
/* ----slider---------------------------------------- */
#headerSliderArea {
	width: 100%;
	height: 634px;
	z-index: 0;
	position: relative;
}

#headerSliderArea:after{
	content:".";
	display: block;
	clear: both;
	width: 100%;
	max-height: 0;
	visibility: hidden;
	z-index: 0;
}

#headerSliderArea .skippr {
	padding: 0;
	margin: 0 auto;
	width: 100%;
	height: 100%;
	max-height: 634px;
	z-index: 0;
	position: relative;
	overflow: hidden;
}

#headerSliderArea .skippr .sliderItem{
	width:100%;
	height: 634px;
}

#headerSliderArea .skippr .skippr-nav-container {
	position: absolute;
	left: 50%;
	-webkit-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	overflow: auto;
	z-index: 100;
}

#headerSliderArea .skippr-nav-element-block {
	width: 18px;
	height: 18px;
	margin: 0 4px;
	border-radius: 50%;
}

#headerSliderArea .skippr-nav-element-active {
	background: #ff0000;
}

#headerSliderArea .skippr .sliderItem .sliderText{
	text-align: center;
	justify-content: center;
	align-self: center;
}

#headerSliderArea .skippr .sliderItem .sliderText img {
	margin: auto;
	width: 928px;
}

#headerSliderArea .globalNavPC {
	margin: 34px auto 0;
	width: 100%;
	max-width: 1000px;
	height: fit-content;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 900;
}

#headerSliderArea h1 , header.pc h1 {
	width: 255px;
}

#headerSliderArea .globalNavPC a , header.pc .globalNavPC a {
	color: #ffffff;
	text-decoration: none;
}

#headerSliderArea ul , .fix-header .globalNav{
	margin: 0 0 0 auto;
	width: 658px;
	font-size: 18px;
}

ul.headerNav1 {
/*	justify-content: center;*/
	width: 100%;
}

ul.headerNav1 > li {
	position: relative;
	height: 45px;
}

ul.headerNav1 li a , ul.headerNav1 li span {
	display: block;
	padding: 1em 0.5em;
	width: auto;
	height: auto;
	font-size: 18px;
	color: #ffffff;
	text-decoration: none;
	transition: 0.2s;
}

ul.headerNav1 li a:hover {
	background: rgba( 100 , 100 , 100 , 0.8 );
}

ul.headerNav2 {
	position: absolute;
	top: 63px;
	left: 0;
	z-index: 1000;
}

ul.headerNav2 li
{width: 220px;
	transition: 0.2s;
}

ul.headerNav2 li a{
	margin: 0;
	padding: 0;
	text-align: left;
	font-size: 18px;
	line-height: 48px;
	text-indent: 18px;
	color: #ffffff;
	display: block;
	background: rgba(0 , 0 , 0 , 0.8);
	transition: 0.2s;
}
ul.headerNav2 li a:hover {
	background: rgba( 100 , 100 , 100 , 0.8 );
}

ul.headerNav2 li {
	overflow: hidden;
	height: 0;
	z-index: 1000;
	transition: 0.2s;
}

ul.headerNav1 li:hover > ul > li {
	overflow: visible;
	height: 48px;
}

/* -------------------------------------------------- */
/* ----h2-------------------------------------------- */
h2 {
    margin: 0 auto 25px;
/*    padding: 50px 0 0 0;*/
    width: 100%;
/*    line-height: 100%;*/
    padding-bottom: 0.1em;
    letter-spacing: 0em;
    text-align: left;
}

h2.title {
	padding: 12px 20px 12px;
	width: 100%;
	max-width: 1000px;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
				justify-content: space-between;
	-webkit-align-items:  flex-start;
				align-items:  flex-start;
	font-size: 18px;
	color: #ffffff;
	background: #444444;
	border-radius: 3px;
}

h2.title span {
	position:relative;
	display: inline-block;
}

h2.title span::before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0.5px;

}

h2.title span.rightTxt {
	position: inherit;
	display: inline;
}

h2.title span.rightTxt::before {
	content: "";
	width: auto;
	height: auto;
	border-bottom: none;
}

h2.title span img {
	height: 46px;
}

/* -------------------------------------------------- */
/* ----index----------------------------------------- */
.infoArea {
	margin: 60px auto 42px;
}

.infoLeft {
	width: 725px;
}

.infoArea ul.infoBox {
	width: 100%;
	margin: 25px auto 23px;
}

ul.infoBox li ul {
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-around;
				justify-content: space-around;
	-webkit-align-items: center;
				align-items: center;
	
	text-align: left;
}
ul.infoBox > li {
	margin: 18px auto 0;
}

ul.infoBox li:first-child {
	margin-top: 0;
}

ul.infoBox li ul li.infoTag {
	margin: 7px 6px 0 0;
	padding: 2px 0 4px;
	font-size: 14px;
	color: #FFFFFF;
	width: 140px;
	text-align: center;
	border-radius: 5px;
}

ul.infoBox li ul li.tag01 {/*お知らせ*/
	background: #00AA95;
}

ul.infoBox li ul li.tag02 {/*イベント情報*/
	background: #D90000;
}

ul.infoBox li ul li.tag03{/*製品情報*/
	background: #FF8000;
}

ul.infoBox li ul li.infoDate {
	margin-top: 6px;
	width: 84px;
	font-size: 14px;
	color: #00AA94;
}

ul.infoBox li ul li.infoText {
	margin: 4px 4px 4px 12px;
	width: 700px;
}
ul.infoBox li ul li.infoText a , .infoMore a {
	text-decoration: none;
}

ul.infoBox li.infoMore img {
	margin-right: 8px;
	vertical-align: middle;
}

ul.infoBox li ul li.infoText {
	margin-top: 11px;
	font-size: 14px;
}
ul.infoBox li ul li.infoText img {
	margin-right: 8px;
}

ul.infoBox li ul li .title {
	margin-bottom: 6px;
	font-size: 16px;
	text-align: left;
}

ul.infoBox li ul li .title a {
	color: #1F1F1F;
}

ul.infoBox  li.infoMore {
	font-size: 14px;
	text-align: right;
}

ul.infoBox li .infoLast {
	justify-content: flex-end;
}

ul.infoBox li .infoLast a {
	text-decoration: none;
}

ul.infoBox li .infoLast li + li {
	margin-left: 22px;
}

.infoArea .infoBtnArea div {
	width: 24%;
}

.infoRight {
	width: 230px;
}

.servicesArea {
	padding: 20px 0 34px;
	background: #E6F2FF;
}

.servicesArea .servicesBox {
	width: 32%;
	background: #ffffff;
	border: 4px solid #444444;
	border-radius: 8px;
	flex-direction: column;
}

.servicesArea .servicesBox:nth-of-type(n+4) {
	margin-top: 18px;
}

.servicesBox .servicesTitle {
	padding: 14px;
	text-align: center;
	font-size: 26px;
	background: #f0f1f1;
	border-radius: 8px 8px 0 0;
}

.servicesBox .servicesText {
	padding: 10px 15px 0;
}

.servicesBox .servicesBtn {
	margin: auto 0 0 0;
	padding: 8px 10px 10px;
	border-radius: 0 0 8px 8px;
}

.servicesArea .center {
	margin: 10px auto 0;
	width: 100%;
	text-align: center;
	font-size: 23px;
}

.clientsArea {
	padding: 22px 0 38px;
	background: #ffffff;
}

.clientsArea .clientsBox > div {
	width: 12%;
}

.clientsArea .clientsBox > div:nth-of-type(n+9) {
	margin-top: 5px;
}


.ctArea {
	padding-bottom: 50px;
}
.calendarArea {
	width: 723px;
}

.calendarArea .calendarBox {
	margin-top:6px;
	width: 100%;
	height: 427px;
}



.strengthArea {
	padding: 28px 0 36px;
	background: #eeeeee;
}

.strengthArea h2 img {height: 24px;}

/*.strengthArea .strengthBox {
	width: 32%;
	background:  #ffffff;
	position: relative;
}

.strengthBox::before {
	content: "";
	padding-top: 100%;
	display: block;
}

.strengthBox .strengthInner {
	padding: 10px 15px;
	position: absolute;
	top:0;
	right: 0;
	bottom: 0;
	left: 0;
}*/


.accessArea {
	padding: 30px 0 32px;
	text-align: center;
	background: url("image/access_bg@2x.png") no-repeat;
}

.accessArea h2 {text-align: center;}

.accessArea h2 img {height: 22px;}
.accessArea .map {
	margin: 25px 0 12px;
	width: 100%;
	height: 265px;
	border: 3px solid #555555;
}

p.address {
	font-size: 18px;
}


footer { 
	padding: 60px 0 56px;
	font-size: 18px;
	color: #FFFFFF;
	text-align: center;
	background: #313339;
}

footer .footerLogo {
	margin: 0 auto;
	width: 350px;
}

footer nav.footerNav1 a,
footer nav.footerNav2 a {
	color: #ffffff;
	text-decoration: none;
}

footer nav.footerNav1 {
	margin: 44px auto 0;
	width: 660px;
	font-size: 18px;
}

footer nav.footerNav2 {
	margin: 24px auto 40px;
	width: 340px;
}

footer small {
	font-size: 16px;
	color: #ffffff;
}

.fix-header {
	padding: 8px 0;
	margin: 0 auto;
	width: 100%;
	position: fixed;
	top: -75px;
	left: 0;
	opacity:0;
	z-index: 1000;
	background-color: #111111;
	}

.fix-header a {
	font-size: 18px;
	color: #ffffff;
	text-decoration: none;
}

.fix-header h1 {
	width: 255px;
	align-self: center;
}

.fix-header .logoArea {
	margin-bottom: 10px;
}

.cb-header {
	position: fixed;
	left:0;
	visibility: hidden;
}

table.borderTable {
	width: 100%;
}

table.borderTable > tbody > tr > th {
	padding: 15px 14px 14px;
	font-weight: normal;
	text-align: left;
	vertical-align: top;
	background: #eeeeee;
	border:1px solid #777777;
}

table.borderTable > tbody > tr > td {
	padding: 7px 5px 9px;
	text-align: left;
	background: #ffffff;
	border:1px solid #777777;
}

div.rightTxt {
	margin:0 0 0 auto;
	text-align: right;
}

.fix-header ul.headerNav1 > li { height: inherit;}

.fix-header ul.headerNav1 li a,.fix-header ul.headerNav1 li span {
	padding: 0 0.5em;
}

.fix-header ul.headerNav2 {top: 32px;}

/* -------------------------------------------------- */
/* ----page------------------------------------------ */
header.pc.page {position: inherit;}

header.pc {padding: 8px 0 10px;height: auto;}

header.pc nav.globalNavPC ul.headerNav1  {margin-top: 10px;width: 658px;}

header.pc.page ul.headerNav1 li a , header.pc.page ul.headerNav1 li span {padding: 0 0.8em;}

header.pc.page ul.headerNav1 > li {height: 28px;}

header.pc.page ul.headerNav2 {top: 34px;}

.pageContents {margin: 34px 0 50px;}

.pageContents h2.title {
	padding: 14px 14px 15px 16px;
	font-size: 20px;
	color: #ffffff;
	background: #444444;}


.pageContents h3 {
	padding: 6px 15px 6px;
	margin-bottom: 20px;
	font-size: 18px;
	border-left: 5px solid #444444;
}

.pageContents h4 {
	padding: 15px 0 2px;
	margin-bottom: 5px;
	width: fit-content;
	font-size: 16px;
	border-bottom: 2px solid #444444;
}

.pageContents p + p{margin-top: 15px;}

.pageContents p + h3 {margin-top: 20px;}

.pageContents table + h3 {margin-top: 20px;}

.pageContents.product .titleText {
	padding: 34px 0 38px;
	text-align: center;
	font-size: 25px;
	background: #f4f4f4;
}

.pageContents.product h2.title {
	margin-bottom: 0;
}

/*.pageContents.product .productBox.flexBox {
	margin: 25px 0;
	width: 100%;
	justify-content: flex-start;
}

.productBox a {text-decoration: none;}

.productBox li{
	margin-right: 2%;
	width: 32%;
}

.productBox li:nth-of-type(3n) {
	margin-right: 0; 
}

.productBox li:nth-of-type(n+4) {
	margin-top: 46px;
}

.productBox .pTitle {
	padding: 14px 0;
	text-align: center;
	font-size: 25px;
	color: #ffffff;
	background: #00aa95;
}*/

.product .tagList.flexBox {
	margin: 25px 0;
	flex-wrap: wrap;
	justify-content: flex-start
}

.product .tagList li {
	margin: 14px 10px 25px 0;
}

.product .tagList a{
	padding: 14px 25px;
	font-size: 18px;
	color: #ffffff;
	background: #00aa95;
	text-decoration: none;
	border-radius: 5px;
}

.product div + h3.productH3 {
	margin-top: 80px;
}

.product h3.productH3 {
	border-left: 0;
	border-bottom: 3px solid #444444;
	display: inline-block;
}

.pageContents.product h4 {
	font-weight: 600;
	border-bottom: 0;
}

.product .productBox {
	width: 100%;
	align-items: stretch;
}

.product .proSlider {
	height: 300px;
}
.product .leftBox {
	width: 45%;
}

.product .kindsList li {
	list-style: disc inside;
}

.product .rightBox {
	width: 55%;
}

.product .rightBox a {display: block;}

.product .rightBox .proImage div + div{
	margin-top: 20px;
}

.product .rightBox .skippr {
}

.product .rightBox .useList.flexBox {
	justify-content: flex-start;
}

.product .rightBox .useList li {
	padding: 5px 12px;
	margin: 3px 5px;
	border: 1px solid #00aa95;
}

.product .rightBox .useList li::before {
	padding-right: 8px;
	content:"●";
	color: #00aa95;
}

/*.product .useList {
	justify-content: flex-start;
	flex-wrap: wrap;
}

.product .useList li {
}

.product .useList li + li::before {
	content: ",";
	padding: 0 5px;
}

/*.product .useList li + li::before {
	content: ",";
	margin: 0 5px;
}*/

/*.pageContents.strength .strengthImage {
width: 250px;
}*/

.StrengthBox.flexBox {
	flex-direction: column;
}

.pageContents.strength {
	padding-bottom: 150px;
}

.strengthArea .strengthBox , .strength .strengthBox {
	width: 32%;
}

.strengthArea .strengthBox.full , .strengthArea .strengthBox h3 ,
.strength .strengthBox.full , .strength .strengthBox h3 {
	padding: 24px 0 22px;
	margin-bottom: 0;
	width: 100%;
	text-align: center;
	font-size: 28px;
	color: #ffffff;
	background: #00aa95;
	border-left: 0;
}

.strengthArea .strengthBox.full ,
.strength .strengthBox.full {
	margin-bottom: 20px;
	width: 100%;
}

.strengthArea .strengthText ,
.strength .strengthText {
	min-height: 228px;
	background: #f4f4f4;
	align-items: center;
}

.strengthArea .strengthText ul ,
.strength .strengthText ul {
	padding: 10px;
}

.strengthArea  .strengthText ul li ,
.strength .strengthText ul li {
	margin-left: 2em;
	list-style:  disc inside;
	font-size: 16px;
	text-indent: -1.5em;
}

.pageContents.job .jobCenter {
	margin: 15px 0 24px;
	text-align: center;
	font-size: 26px;
	font-size: 18px;
}

.job .jobCenter div {
	padding-bottom: 28px;
	font-size: 33px;
	color: #00aa94;
}

.job .jobCenter img {
	margin-top: 25px;
}

.job .jobBox {
	width: 100%;
	height: 100%;
}

.job .jobBox + .jobBox {
	margin-top: 18px;
}

.job .jobInfoBox{
	margin-top: 80px;
}

.job .jobBox .jobLeft {
	width: 272px;
	font-size:28px;
	color: #ffffff;
	background: #444444;
	justify-content: center;
	align-items: center;
}

.job .jobBox .jobRight {
	padding: 25px 18px 22px;
	width: 728px;
	font-size: 16px;
	background: #f4f4f4;
}

.job .jobInfoBox {
	width: 49%;
	flex-direction: column;
}

.job .jobInfoBox h3 {
	padding: 24px 0 22px;
	margin-bottom: 0;
	width: 100%;
	text-align: center;
	font-size: 28px;
	color: #ffffff;
	background: #00aa95;
	border-left: 0;
}

.job .jobInfoBox .jobInfoText {
	padding: 20px 20px 16px;
	width: 100%;
	background: #f4f4f4;
	height: calc(100% - 88px);
}

.job .jobInfoBox .jobInfoText .center{
	margin-bottom: 15px;
	text-align: center;
}

.job .jobInfoTable th {
	padding: 5px 8px;
	width: 110px;
	font-size: 18px;
	color: #ffffff;
	text-align: center;
}

.job .btnArea {
	margin: 12px 0 0 auto;
	width: 100%;
}

.pageContents.di .diList ul.flexBox {
	justify-content: space-between;
	align-items: flex-start;
	font-size: 20px;
}

ul.diList > li > ul > li:nth-of-type(n+1) {
	margin-top: 15px;
}

.diList ul  li:nth-of-type(1) {
	padding: 8px 12px;
	margin: 0 15px;
	width: 100px;
	text-align: center;
	color: #ffffff;
	background:  #00aa95;
}

.diList ul li:nth-of-type(2) {
	padding-top: 8px;
	margin-right: 15px;
	width: 605px;
	text-align: left;
}

.diList ul li.imageBox {
	width: 250px;
}

.pageContents.emp .empBox {
/*	padding: 8px 12px;
	width: 100%;
	background: #eeeeee;*/
}

.emp .empBox + .empBox {
	margin-top : 68px;
}

.emp .empLeft {
	width: 410px;
}

.emp .empLeft .empName {
	padding: 14px 0 16px;
	text-align: center;
	font-size: 26px;
	line-height: 1em;
	color: #ffffff;
	background: #00aa95;
}

.emp .empBox .empPhoto {
	width: 100%;
}

.emp .empLeft .empName span {
	font-size: 18px;
}

.emp .empRight {
	width: 556px;
	font-size:15px;
}


.emp .empBox li div.qBox {
	padding: 10px 15px;
	width: 100%;
	color: #00aa94;
	background: #f4f4f4;
}

.emp .empBox li div.aBox {
	padding: 10px 15px;
	background: #ffffff;
}

.pageContents.faq .faqItemList {
	width: 100%;
	background: #00aa95;
}

.faq .faqItemList li {
	width: 25%;
	text-align: center;
}

.faq .faqItemList a {
	padding: 15px;
	display: block;
	color: #ffffff;
	background: #00aa95;
	text-decoration: none;
}

.faq .faqItemList a:hover {
	background: rgba( 255 , 255 , 255 , 0.4 )

}

.faq .faqList .flexBox {
	justify-content: flex-start;
}

.faq h3 {
	margin: 15px 0 5px;
}

.faq .faqList > li > ul > li:nth-of-type(1) {
	padding: 10px 15px;
	width: 100%;
	color: #00aa94;
	background: #f4f4f4;
}

.faq .faqList > li > ul > li:nth-of-type(1)::before {
	margin-right: 10px;
	content: "Q.";
	font-size: 1.6em;
}

.faq .faqList > li > ul  > li:nth-of-type(2) {
	padding: 10px 15px;
	background: #ffffff;
}


.faq .faqList > li > ul > li:nth-of-type(2)::before {
	margin-right: 10px;
	content: "A .";
	font-size: 1.6em;
}



.pp div.ppList + div.ppList {
	margin-top: 20px;
}

.pp div.ppList ul li {
	list-style: disc inside;
}

.tou .pageRead {
	line-height: 1.8em;
}

.tou ul.touList {
	margin: 20px 0;
}

.tou ul.touList li::before {
	content: "・";
	color: #cccccc;
}

.tou .pageRead p span {
	font-weight: 600;
}

/*----------------------テキストスタイル*/

.s19 {
	font-size:19px;
	font-weight: 600;
}

.ss12blue{
	color:#001E8D;
	font-weight: normal;
}
.ss8 {
	font-size: 8px;
	color: #777777;
}

.ss10 {
	font-size: 10px;
	color: #999999;
	line-height: 140%;
}
.ss9 {
	font-size: 9px;
	color: #999999;
}


.ss12b {
	font-size: 12px;
	font-weight: 600;
	color: #777777;
	line-height: 140%;
}
.ss12w {
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
}


.ss12lblue {
	font-size: 12px;
	font-weight: bold;
	color: #5AB6F7;
}

.ss12lblue2 {
	font-size: 12px;

	color: #5AB6F7;
}
.ss12lineb{
	font-size:12px;
	font-weight: 600;
	color: #777777;
	text-decoration: underline;
}

.ss12pink{
    color:#F7879F;
	font-weight: bold;
}

.ss12pink2{
	color:#FF8385;
	font-weight: bold;
}
.ss12pink3 {
	font-size: 12px;
	color: #F19B84;
}
.ss12pink4 {
	font-size: 12px;
	color: #FF7F83;
}


.ss12red{
	font-size: 12px;
	color: #FF0000;
	line-height: 140%;
}

.ss12org{
	color:#F9C03B;
	font-weight: normal;
}
.ss11 {
	font-size: 11px;
	color: #777777;
	line-height: 180%;
}
.ss11blue {
	font-size: 11px;
	color: #0066CC;

}
.ss11hanix {
	font-size: 11px;
	font-weight: bold;
	color: #00AFAF;
}
.ss12hanix {
	font-size: 12px;
	color: #00AFAF;
	font-weight: bold;
	line-height: 140%;
}


.ss12orange{
	font-size: 12px;
	color: #FF9900;
}

.ss12blue{
	font-size: 12px;
	color: #0066CC;
}

.ss12pink {
	font-size: 12px;
	font-weight: bold;
	color: #F55FB4;
}
.ss12pink5 {
	font-size: 12px;
	line-height: 137%;
	color: #F37F88;
}



.ss12green{
	font-size: 12px;
	color: #8BBB93;
}

.ss13red{
	font-size: 13px;
	color: #CC0000;
}

.ss13orange{
	font-size: 13px;
	color: #FF9900;
}

.ss13blue{
	font-size: 13px;
	color: #0066CC;
}

.ss14hanix {
	font-size: 14px;
	color: #00AFAF;
	font-weight: bold;
}

.ss14b {
	font-size: 14px;
	color: #555555;
	font-weight: bold;
	
}
.ss14 {
	font-size: 14px;
	color: 777777;
	line-height: 140%;
}

.ss14blue2 {
	font-size: 14px;
	color: #83C9BE;
}

.ss14pink{
    font-size: 14px;
    color:#F7879F;
	font-weight: bold;
}
.ss15hanix {
	font-size: 15px;
	color: #00AFAF;
	font-weight: bold;
	padding-bottom: 3px;
}
.ss15 {
	font-size: 15px;
	font-weight: 600;
	color: #777777;
}
.ss14blue {
	font-size: 14px;
	font-weight: bold;
	color: #5AB6F7;
}


.ss16pink{
    font-size: 16px;
    color:#F7879F;
	font-weight: bold;
}

.ss16hanix {
	font-size: 16px;
	color: #00AFAF;
	font-weight: bold;
}
.ss16red {
	font-size: 16px;
	color: #FF0101;
	line-height: 130%;
}
.ss16red2 {
	font-size: 16px;
	color: #E40013;
	line-height: 137%;
}

@media screen and (max-width: 768px) {
	.pc {display: none;}
	.sp {display: block;}
	
	header { padding: 1em 0;background: #111111;}
	
	header h1 {width: 60vw;}

	header ul li , header ul li:last-child {width: 30%;}
	
nav.globalNavSP {
	width: 100%;
	position: fixed;
	z-index: 998;
	top: 0;
	left: 0;
	text-align: center;
	color: #ffffff;
	transform: translateY(-100%);
	transition: all 0.6s;
	background-color: #111111;
}

nav.globalNavSP ul {
	margin: 0 auto;
	padding: 0;
	width: 100%;
	background: #111111;
}

nav.globalNavSP > ul > li {
	font-size: 1.1em;
	list-style-type: none;
	padding: 0;
	width: 100%;
	border-bottom: 1px dotted #FFFFFF;
}

nav.globalNavSP > ul > li:last-child {
	margin: 0.5em 0;
	padding-bottom: 0;
	border-bottom: none;
}

nav.globalNavSP ul li a {
	display: block;
	color: #ffffff;
	padding: 1em 0;
	text-decoration: none;
}

nav.globalNavSP ul li ul.flexBox { 
	justify-content: center;
	align-items: center;
	}

nav.globalNavSP ul li ul.flexBox li + li {margin-left: 1em;}

nav.globalNavSP ul li ul.flexBox li  {width: 45px;}

nav.globalNavSP .headerNav1 ul li a {
	padding: 0;
	}

nav.globalNavSP .headerNav1 img {
	margin-bottom: 2vw;
	width: 90vw;
}

.headerSP nav.globalNavSP .headerNav3 li {
	width: 29vw;
}

	ul.headerNav1 > li {
		position: inherit;
		height: auto;
	}

	nav.globalNavSP .headerNav2 {
		width: 100%;
		position: inherit;
	}

	nav.globalNavSP ul.headerNav2 li {
		width: 100%;
		height: inherit;
		overflow: inherit;
	}

	nav.globalNavSP ul.headerNav2 li a {
		text-align: center;
		font-size: 1em;
	}

	ul.headerNav1 li:hover > ul > li {
		overflow: inherit;
	}

ul.headerNav1 li:nth-of-type(2) span ,
ul.headerNav1 li:nth-of-type(3) span {
	color: #666666;
}

	/* このクラスを、jQueryで付与・削除する */
nav.globalNavSP.active {
	transform: translateY(0%);
}

.navToggle {
	display: block;
	position: fixed;
	top: 0;
	right: 0;
	width: 42px;
	height: 42px;
	cursor: pointer;
	z-index: 999;
	background: #111111;
	text-align: center;
}

.navToggle span {
	display: block;
	position: absolute;	/* .navToggleに対して */
	width: 30px;
	border-bottom: solid 3px #ffffff;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
	left: 6px;
}

.navToggle span:nth-child(1) {
	top: 9px;
}

.navToggle span:nth-child(2) {
	top: 18px;
}

.navToggle span:nth-child(3) {
	top: 27px;
}

.navToggle span:nth-child(4) {
	border: none;
	color: #eee;
	font-size: 9px;
	font-weight: bold;
	top: 34px;
}
/* 最初のspanをマイナス45度に */
.navToggle.active span:nth-child(1) {
	top: 18px;
	left: 6px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/* 2番目と3番目のspanを45度に */
.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
	top: 18px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}

/* ---sp slider--------------------------------------- */
	#headerSliderArea , #headerSliderArea .skippr .sliderItem {height: 250px;}

	#headerSliderArea .sliderItem {
		width: 100vw;
		background-size: contain;
	}

	#headerSliderArea .skippr .sliderItem .sliderText img {width: 85vw;}

	.inner {
		margin: 0 auto;
		width: 96vw;
	}

	h2 {padding-top: 1em;}

	.infoArea {	margin: 1em 0;}

	.infoArea h2.title span, .infoArea h2.title span.rightTxt { height: 1.2em;}

	ul.infoBox li ul {flex-wrap: wrap;}

	ul.infoBox li ul li.infoImage , ul.infoBox li ul li.infoText{width:  100%;}

	ul.infoBox li ul li.infoDate {align-self: center;}

	.infoArea .infoBtnArea div {width: 48%;}

	.infoArea .infoBtnArea div:nth-of-type(n+3) {margin-top: 0.5em;}

	h2.title span img , h2.title span.rightTxt img {height: 25px;}



	.strengthArea h2 img , .accessArea h2 img {height: 20px;}

	.job .jobBox .jobLeft , .job .jobInfoBox , .job .jobInfoTable th {width: 100%;}

	.job .btnArea {
		margin-left: 0;
		width: 100%;
	}

	
	.productBox li {
		margin: 0 0 2em 0;
		width: 100%;
	}
	
	.productBox li:nth-of-type(n+4) {margin-top: 0;}

	.pageContents.strength {margin-bottom: 0;}

	.pageContents.product .titleText {
		padding: 15px;
		font-size: 18px;
	}

	.strength .strengthBox {
		margin-bottom: 15px;
		width: 100%;
	}

.product .tagList a {
	padding: 6px 16px;
	font-size: 16px;}

.product .tagList li {
	margin: 10px 12px 10px 12px;
}

.product .leftBox , .product .rightBox {
	width: 100%;
}

.product .useList li {margin:4px 2px;width: auto;}

	.borderTable.formTable th , .borderTable.formTable td {
		width: 100%;
		display: block;
	}

table.borderTable.formTable > tbody > tr > th , table.borderTable.formTable > tbody > tr > td ,
table.jobInfoTable > tbody > tr > th , table.jobInfoTable > tbody > tr > td {
	width: 100%;
	max-width: inherit;
	display: block;
	border-bottom: none;
	}

	table.borderTable.formTable > tbody > tr > th {
	padding-left: 4px;
	}

	table.formTable th {
	width: 100%;
	max-width: inherit;
	display: block;
	border-bottom: none;
	}
	
table.borderTable td.last {border-bottom:1px solid #000000;}

table.formTable textarea {width: 100%;}

	table.jobInfo {}

	footer .footerLogo {width: 60vw;}

	footer nav {margin: 1.5em 0;}

	footer nav.footerNav1 li {padding: 1em;}

	footer nav.footerNav2 {width: 90vw;}
	
	footer nav li , footer nav li + li {border: 0;}
	
	footer nav.footerNav1{ width: 100%;}
	.fix-header {display: none;}
	
	#pagetop {
		right: 1em;
		bottom: 2em;
	}
}