@charset "utf-8";
/* CSS Document */
.content-header-container{ background:#e7e6e6;}
.site-title-wrap{ padding: 1rem; width: 100%; position: relative;}
.site-title-wrap:before{ content:""; display: block; padding-top:3.645833%;}
.content-header .site-title{ width: 20%; max-width:320px; position: absolute; top: 1rem; left: 1rem;}
.content-header .page-title{ margin: 0 auto; padding: 10% 90px 0; max-width: 1280px; text-align: center; font-size:4vw;}
.content-header .page-title.single-page-title{ font-size:2.4vw;}
.content-header .page-title span{ font-size:2.4vw; display: block;}
#headerBg,#headerBgSm{ margin-top: -1px;}
/*//////////////////////
	CONTENTS
//////////////////////*/
h3{ margin-bottom: 60px; font-size:4vw;}
h3 span{ display:block; font-size:2vw;}
.s-container{ padding: 0 90px;}
.s-inner{ margin-bottom: 4%;}

.about{ margin-top: -8.333333%; width: 100%; position: relative; z-index: 1;}
.about:before{ content:""; display: block; padding-top:63.5%;}
.about-container{ width:100%; position:absolute; top:0; left:0; bottom:0; right:0; z-index:1;}
.about-inner{ width:100%; position:absolute; top:0; left:0; bottom:0; right:0;}
.about-txt-wrap{ width:100%; height:100%; display:table;}
.about-txt-inner{ padding:0 90px; display:table-cell; vertical-align:middle;}
.about-txt-inner h2{ margin-bottom: 60px; font-size:3.2vw;}
.about-txt-inner h2 span{ display:block;}
.af-list-wrap h3{ text-align: center;}
.af-section-container .af-list li{ padding-top: 2.4rem; width:48%; position: relative;}
.af-section-container .af-list li:nth-of-type(2n){ margin-top:60px;}
.af-section-container .af-list li h4{ padding: 1.2rem; display: inline-block; position: absolute; top: 0; left:-1rem; font-size: 1.6rem; font-weight: normal; color: #fff; background:#00aeef; z-index:2;}
.af-section-container .af-list li .af-thumbnail{ z-index:1;}
.about-prof{ width: 100%; position: relative;}
.ap-section-container{ margin-top: -1px; background:#e7e6e6;}
.ap-section-inner{ padding: 2% 0; width:100%; text-align: center;}
.ap-table-wrap{ padding: 0 90px; width: 100%; display: table;}
.ap-table{ display: table-cell;}
.ap-tr{ margin-bottom: 2rem; display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:start; -ms-flex-pack:start; -webkit-justify-content:flex-start; justify-content:flex-start;}
.ap-th{ margin-right:2rem; width:46%; text-align: right;}
.ap-td{ -webkit-flex: 1; flex: 1; text-align: left;}
.about-access{ width: 100%; position: relative; text-align: center;}
.aa-txt{ margin-bottom: 2%;}
#apBottom,#apBottomSm{ margin-top: -1px;}

.business{ margin-top: -8.333333%; width: 100%; position: relative; z-index: 1;}
.business:before{ content:""; display: block; padding-top:63.5%;}
.business-container{ width:100%; position:absolute; top:0; left:0; bottom:0; right:0; z-index:1;}
.business-inner{ width:100%; position:absolute; top:0; left:0; bottom:0; right:0;}
.business-txt-wrap{ width:100%; height:100%; display:table;}
.business-txt-inner{ padding:0 90px; display:table-cell; vertical-align:middle; color: #fff;}
.business-txt-inner h2{ margin-bottom: 60px; font-size:3.2vw;}
.business-txt-inner h2 span{ display:block;}
.business-oem{ padding-top: 4%;}
.bo-txt{ margin-bottom: 2rem;}
.bo-flow{ padding-top: 3rem; width: 100%; }
.bo-flow li{ margin-bottom: 4rem; padding: .6rem; position:relative; background: #e7e6e6;}
.bo-flow li .step{ padding: 1rem; line-height: 1; background: #00aeef; color: #fff; position: absolute; top: -1rem; left: -1rem;}
.bo-flow li .step span{ display: block; font-size: 3rem;}
.bo-flow li h4{ margin-bottom: 1rem; padding:1.4rem 1rem 2rem 6rem; border-radius: .6rem;}
.bo-flow li p{ padding: 0 .6rem;}

.pp-itemlist{ margin:2rem 0; display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-justify-content:space-between; justify-content:space-between; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
.pp-itemlist li{ margin:0 1%; width:23%; background-color:#e7e6e6; box-shadow: 1px 1px 4px gray;}
.pp-itemlist-img{ background-color:#fff;}
.pp-itemlist-txt{ padding:2rem 10%;}
.pp-itemlist-txt h4{ margin-bottom:.6rem; font-size:1.8rem;}

.pi-itemlist{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:start; -ms-flex-pack:start; -webkit-justify-content:flex-start; justify-content:flex-start; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
.pi-itemlist li{ margin:0 2% 2rem 0; padding:1rem; background-color:#e7e6e6;}
.pi-name{ margin-bottom:0; font-size:1.8rem;}

.info-list{ margin:0 auto 2rem; padding:2rem 0; width:100%; max-width:600px;}
.info-article:not(:last-child){ margin-bottom:6rem;}
.info-article a{ display:block; color:#000;}
.info-article-header{ padding-top:2rem; position:relative;}
.info-article-header h2{ margin-bottom: 1rem; font-size:2rem;}
.info-article-date{ padding:.6rem; position:absolute; top:-2rem; right:0; background-color:#999; color:#fff;}
.info-list-ft{ text-align: center;}
.next-link a
.next-link a,.view-more-button{ display: inline-block; padding: 1rem 3rem; border: 1px solid #333; color: #333; position: relative;}
.next-link a:hover,.view-more-button:hover{ color: #fff;}
.next-link a::before,.view-more-button::before{ content: ""; width:0; height: 100%; display: inline-block; position: absolute; top: 0; left:0; background:#000; z-index: -1; -webkit-transition: .2s; transition: .2s;}
.next-link a:hover::before,.view-more-button:hover::before{ width: 100%;}

@-webkit-keyframes scale {
  0% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; }
  45% { -webkit-transform: scale(0.1); transform: scale(0.1); opacity: 0.7; }
  80% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; }
}
@keyframes scale {
  0% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; }
  45% { -webkit-transform: scale(0.1); transform: scale(0.1); opacity: 0.7; }
  80% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; }
}
.infinite-scroll-request .ball-pulse > div:nth-child(1) { -webkit-animation: scale 0.75s -0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); animation: scale 0.75s -0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); }
.infinite-scroll-request .ball-pulse > div:nth-child(2) { -webkit-animation: scale 0.75s -0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); animation: scale 0.75s -0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); }
.infinite-scroll-request .ball-pulse > div:nth-child(3) { -webkit-animation: scale 0.75s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); animation: scale 0.75s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); }

.infinite-scroll-request .ball-pulse > div { background-color: #ccc; width: 15px; height: 15px; border-radius: 100%; margin: 2px; -webkit-animation-fill-mode: both; animation-fill-mode: both; display: inline-block; }

.single-article{ margin:0 auto 4rem; padding:2rem 0; width:100%; max-width:600px;}
.single-article-header{ padding-top:2rem; position:relative;}
.single-article-detail{ margin-bottom: 4rem;}
.single-article-date{ padding:.6rem; position:absolute; top:-2rem; right:0; background-color:#999; color:#fff;}
.single-backlink{ text-align: center;}
.single-backlink a{ display: inline-block; padding: 1rem 3rem; border: 1px solid #333; color: #333; position: relative;}
.single-backlink a:hover{ color: #fff;}
.single-backlink a:before{ content: ""; width:0; height: 100%; display: inline-block; position: absolute; top: 0; left:0; background:#000; z-index: -1; -webkit-transition: .2s; transition: .2s;}
.single-backlink a:hover:before{ width: 100%;}

.privacy h2{ text-align: center;}
.privacy h3{ margin: 3rem 0; padding: 0; font-size: 2rem;}
.privacy ol{ margin-bottom: 1rem; padding-left:2rem;}
.privacy ol li{ list-style-type: decimal;}
.privacy .privacyadd p{ margin-bottom: 0;}

.contact .s-container{ max-width: 800px;}
.contact .contact-hd{ margin-bottom: 5rem;}
.contact .tabletr{ margin-bottom: 2rem;}
.contact .title{ font-size: 2rem;}
.contact .screen-reader-response{ margin-bottom: 3rem; text-align: center; font-size: 2rem;}
.contact .wpcf7-response-output{ display:none;}
.contact input[type="text"],.contact input[type="email"],.contact input[type="tel"],.contact textarea{ padding: .6rem 1rem; width: 100%; line-height: 2; border: 1px solid #999;}
.contact select{ padding: .6rem 1rem; line-height: 2; cursor: pointer; border: 1px solid #999;}
.contact .contact-acceptance{ margin-top: 1rem; font-size: 1.8rem;}
.contact .contact-acceptance label{ cursor:pointer;}
.contact .contact-acceptance span{ margin-right: .6rem;}
.contact .contact-acceptance input[type="checkbox"]{ padding:.8rem; position:relative; top:.2rem; border:1px solid #cccccc; border-radius:.1rem; cursor:pointer;}
.contact .contact-acceptance input[type="checkbox"]:hover{ border:1px solid #ddd;}
.contact .contact-acceptance input[type="checkbox"]:checked::after{ content: ""; display: block; position: absolute; top:-.6rem; left:.3rem; width:.6rem; height:1.6rem; transform: rotate(40deg); border-bottom:4px solid #666; border-right:4px solid #666;}
.contact .submitbtn{ text-align: center;}
.contact input[type="submit"]{ padding: 1rem 2rem; font-size: 2.4rem; cursor: pointer; background:#00aeef; color: #fff;}
.contact input[type="submit"]:hover{ opacity: .8;}

.sitemap .s-container{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; -webkit-justify-content:center; justify-content:center;}
.sitemap li{ margin-bottom: 1.6rem; font-size: 1.6rem;}

/* Share button */

.sns-share ul{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:start; -ms-flex-pack:start; -webkit-justify-content:flex-start; justify-content:flex-start; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
.sns-share li:not(last-child){ margin:0 1rem 1rem 0;}
.sns-share a{ display: block; padding:.6rem 1.2rem; border-radius:.3rem; color: white; text-decoration: none; text-align: center; font-weight: bold;}
.snsbtn-twitter{ background: #55acee;}
.snsbtn-facebook{ background: #3b5998;}
.snsbtn-google{ background: #dd4b39;}
.snsbtn-line{ background: #54bc4d;}
.snsbtn-hatena{ background: #008FDE;}
.snsbtn-pocket{ background: #ee4056;}
.snsbtn-tumblr{ background: #36465d;}
.snsbtn-pinterest{ background: #c60120;}
/*//////////////////////
	media query
//////////////////////*/
@media (min-width:769px) {
  h3.s-title-rb{ margin-bottom: 2rem; text-align: right; border-bottom:.4rem solid #ccc;}
  h3.s-title-r{ margin-bottom: 2.4rem; text-align: right;}
  .view-svg-sm{ display: none;}
  .af-section-container .af-list{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-justify-content:space-between; justify-content:space-between; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
  .bo-flow{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-justify-content:space-between; justify-content:space-between; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
  .bo-flow li{ width:28%;}
  .bo-flow li:not(:nth-of-type(3n)):after{ font-family: 'icomoon' !important; content: "\e900"; position: absolute; top: 50%; right: -18%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
  .bo-flow li h4 span{ margin-bottom: .6rem; display: block;}
  .pi-content{ display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-justify-content:space-between; justify-content:space-between;}
  .pi-img{ width:50%;}
  .pi-txt-wrap{ width:42%;}
}

@media (max-width:768px){
  .site-title-wrap:before{ padding-top:5.882353%;}
  .content-header .site-title{ width:30.555555%;}
  .content-header .page-title{ padding: 10% 10% 0; font-size:6.4vw}
  .content-header .page-title.single-page-title{ padding-bottom:10%; font-size:3.2vw;}
  .content-header .page-title span{ font-size:3.2vw;}
  .view-svg-pc{ display: none;}
  h3{ margin-bottom:10%; font-size:6.4vw;}
  h3 span{ font-size:3.2vw;}
  .s-container{ padding: 0 10%;}
  .about{ margin-top: -21.333333%;}
  .about:before{  padding-top:200%;}
  .about-txt-wrap{ height: auto; display: block; position: absolute; bottom: 20%; left: 0;}
  .about-txt-inner{ padding:0 10%;}
  .about-txt-inner h2{ font-size:4.2vw;}
  .about-txt-inner .about-txt{ font-size:3.2vw;}
  .af-section-container h3{ font-size:6.4vw;}
  .af-section-container h3 span{ font-size:3.2vw;}
  .af-section-container .af-list li{ width:100%;}
  .af-section-container .af-list li:not(last-of-type){ margin: 0 0 60px;}
  .af-section-container .af-list li h4{ font-size:3.2vw;}
  .af-section-container .af-list li .af-txt{ font-size:3.2vw;}
  .ap-table-wrap{ padding: 0 10%;}
  .ap-tr{ margin-bottom: 1rem;}
  .ap-th{ margin-right:4%; width:30%;}
  .business{ margin-top: -21.333333%;}
  .business:before{  padding-top:153.333333%;}
  .business-txt-inner{ padding:0 10%;}
  .business-txt-inner h2{ font-size:4.2vw;}
  .business-txt-inner h2 span{ display: inline;}
  .business-txt-inner .business-txt{ font-size:3.2vw;}
  .bo-flow li{ margin-bottom: 6rem;}
  .bo-flow li:not(:last-of-type):after{ font-family: 'icomoon' !important; content: "\e902"; position: absolute; bottom:-4rem; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
  .bo-flow li h4 span{ margin-right: .6rem; display:inline-block;}
  .pp-itemlist li{ margin:0 1% 2rem; width:48%;}
  .pi-img{ margin-bottom:2rem;}
}

@media (max-width:480px){
  .pp-itemlist li{ margin:0 1% 2rem; width:98%;}
}