@charset "utf-8";

/*
 * style.css
 *
 *  version --- 1.0
 *  updated --- 2017/11/30
 */

/* !HTML5 elements
---------------------------------------------------------- */
header, 
footer, 
nav, 
section, 
aside, 
article {
    display: block;
}

/* !Reseting
---------------------------------------------------------- */
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

fieldset {
  border: none;
}

ul,
ol,
li {
	list-style: none;
}

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

table {
	border-collapse: collapse;
}

button {
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
}

select::-ms-expand {
	display: none;
}

input[type=radio]::-ms-check,
input[type=checkbox]::-ms-check{
	display: none;
}

select,
input[type=radio],
input[type=checkbox],
input[type=text],
input[type=password],
input[type=email],
input[type=tel],
input[type=number],
input[type=reset],
input[type=button],
input[type=submit],
textarea {
	appearance: none;
	border-radius: 0;
	font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

input[type=text]::-ms-clear,
input[type=tel]::-ms-clear,
input[type=number]::-ms-clear{
	display: none;
}

input[type=reset],
input[type=button],
input[type=submit]  {
	font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	cursor: pointer;
}

*,
*:before,
*::after {
	box-sizing: border-box;
}
/* !Clearfix
---------------------------------------------------------- */
.clearfix {
    display: block;
}

.clearfix:after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    visibility: hidden;
}

/* !Layout
---------------------------------------------------------- */
html {
    overflow-y: scroll;
    font-size: 62.5%;
}

body {
    font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: 1.6rem;
    -webkit-text-size-adjust: none;
    line-height: 1.5;
    font-weight: normal;
    color: #111;
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

@media screen and (min-width: 768px) and (max-width: 1200px) {
    html {
        font-size: 0.83vw;
    }
}
/*** sp ***/
@media screen and (max-width: 767px) {
    html {
        font-size: 62.5%;
    }
	
	body {
		font-size: 1.4rem;
	}
}
@media screen and (max-width: 374px) {
	html {
	    font-size: 2.66667vw;
	}
}


@media screen and (min-width: 751px) {
    .is-sp {
        display: none;
    }
}
@media only screen and (max-width : 767px){
	.is-pc {
		display: none;
	}
}

/* !Base Fonts -------------------------------------------------------------- */
a {
    color: inherit;
    text-decoration: none;
}

/*** hover ***/
@media screen and (min-width: 960px) {
    a {
        transition: all 0.5s;
    } 

    .op {
        transition: opacity 0.5s ease-out;
    }

    .op:hover {
        opacity: .7;
    }

    a[href^="tel:"] {
        cursor: default;
        pointer-events:none;
    }
}

.is-hide {
    display: none;
}


/* !wrapper
---------------------------------------------------------- */
#wrapper {
	position: relative;
	padding-top: 10rem;
}

/* !header
---------------------------------------------------------- */
#header {
	display: flex;
	justify-content: space-between;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 99;
	width: 100%;
	background:	#fff;
	box-shadow: 0 0.4rem 1rem rgba(0,0,0,0.05);
}

.header-logo {
	display: flex;
	align-items: center;
	padding: 0 2rem;
	height: 10rem;
}
.header-logo img {
	width: 42.5rem;
}

.btn-menu {
	display: none;
	width: 6rem;
	height: 6rem;
	background: url(../img/common/icon_menu.svg)no-repeat center;
	background-size: 100%;
}
.btn-menu.is-active {
	background-image: url(../img/common/icon_menu_close.svg);
}

#g-navi .bg {
	display: flex;
	padding: 0 3rem;
}
#g-navi ul {
	display: flex;
	align-items: center;
	gap: 0 5rem;
	height: 10rem;
}
#g-navi li .eng {
	margin-bottom: 0.8rem;
	line-height: 1;
	white-space: nowrap;
	word-wrap: break-word;
	word-break:break-all;
	font-size: 1.8rem;
	font-weight: 700;
}
#g-navi li .jap {
	line-height: 1;
	font-size: 1.2rem;
}
#g-navi li .file:after,
.footlinks li .file:after {
	content: "";
	display: inline-block;
	margin-left: 0.5rem;
	width: 1.1rem;
	height: 1.1rem;
	background: url(../img/common/icon_file.svg)no-repeat center;
	background-size: 100%;
}
#g-navi .btn-link {
	display: flex;
	align-items: center;
	margin: 0 0 0 5rem;
}
#g-navi .btn-link .btn {
	padding: 0 4rem;
	height: 6rem;
	font-size: 1.6rem;
}

/* !footer
---------------------------------------------------------- */
#footer {}
.footer-inner {
	padding: 4rem 0;
}
.footer-inner .inner {
	display: flex;
	justify-content: space-between;
}
.footlogo {
	margin-bottom: 1rem;
	line-height: 1;
	font-size: 2rem;
	font-weight: 600;
}
.footlogo img {
	display: block;
	margin-bottom: 1rem;
	width: 16.5rem;
}
#footer .access {
	font-size: 1.4rem;
}
#footer .access p {
	line-height: 1.5;
}
#footer .access .tel a {
	color: #00AEEF;
	font-weight: 700;
	font-size: 2.6rem;
}
#footer .access .btn-link {
	margin-top: 1rem;
}
#footer .access .btn-link .btn {
    height: 5.2rem;
    max-width: 25rem;
}

.footlinks {
	display: flex;
	gap: 0 6rem;
}
.footlinks .eng {
    margin-bottom: 0.8rem;
    line-height: 1;
    white-space: nowrap;
    word-wrap: break-word;
    word-break: break-all;
    font-size: 1.8rem;
    font-weight: 700;
}
.footlinks .jap {
    line-height: 1;
    font-size: 1.2rem;
}
#footer .cooperate {
	display: flex;
	gap: 0 4rem;
	margin-top: 6rem;
	padding-top: 2rem;
	border-top: 1px solid #ccc;
}
#footer .cooperate .head {
    margin-bottom: 0.8rem;
    font-size: 1.8rem;
    font-weight: 700;
}
#footer .iso .logo img {
	margin-bottom: 1rem;
	max-width: 38.4rem;
}
#footer .iso .logo p {
	line-height: 1.16667;
	font-size: 1.2rem;
}
#footer .sns img {
	width: 2.4rem;
}

#copyright {
	padding: 1rem 0;
	background: #F2F2F2;
	text-align: center;
	line-height: 1.25;
	font-family: YakuHanJP, "Montserrat", sans-serif;
	font-size: 1.2rem;
}

/**/
@media only screen and (max-width : 1400px){
	.header-logo img {
	    width: 32rem;
	}
	
	#g-navi ul {
		gap: 0 3.2rem;
	}
	#g-navi .btn-link { 
		margin-left: 3.2rem;
	}
	#g-navi li .contact {
		padding: 0 3.2rem;
	}
}
/*** hover ***/
@media screen and (min-width: 960px) {
	
	#g-navi li a:hover,
	.footlinks li a:hover {
		color: #00AEEF;
	}
	#g-navi li a:hover .file:after,
	.footlinks li a:hover .file:after {
		background-image: url(../img/common/icon_file_blue.svg);
	}
	#g-navi li .contact:hover {
		opacity: 0.7;
		color: #fff;
	}
}
/* sp */
@media only screen and (max-width : 767px){
	#wrapper {
	    padding-top: 6rem;
	}
	
	.header-logo {
	    padding: 0 1rem;
	    height: 6rem;
	}
	.header-logo img {
		width: 26rem;
	}
	
	.btn-menu {
		display: block;
		height: 6rem;
		width: 6rem;
	}
	
	#g-navi {
		opacity: 0;
		visibility: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		position: absolute;
		top: 100%;
		right: 0;
		transition-duration: 0.3s;
		padding: 0;
		height: calc(100vh - 6rem);
		width: 100%;
		background: rgba(0, 0, 0, 0.2);
	}
	#g-navi .bg {
		display: block;
		transform: translateX(100%);
		transition-duration: 0.3s;
		padding: 1rem 0 5rem;
		margin-left: auto;
		width: 90%;
		max-width: 27.5rem;
		background: #fff;
	}
	#g-navi.open {
		opacity: 1;
		visibility: visible;
	}
	#g-navi.open .bg {
		transform: translateX(0%);
	}
	#g-navi ul {
		display: block;
		height: auto;
	}
	#g-navi li {
		border-bottom: 1px solid #F2F2F2;
	}
	#g-navi li a {
		display: block;
		padding: 2rem 3rem;
	}
	#g-navi li .eng {
	    font-size: 2.4rem;
	}
	#g-navi .btn-link {
		display: block;
		margin: 2rem 3rem 0;
		text-align: left;
	}
	#g-navi .btn-link p {
		line-height: 1.71;
		font-size: 1.4rem;
	}
	#g-navi .btn-link .btn {
		margin-bottom: 2rem;
		padding: 0;
		font-size: 1.4rem;
	}
	
	.footer-inner .inner {
	    display: block;
	}
	.footer-inner .left {
		text-align: center;
	}
	.footlogo img {
	    margin: 0 auto 1rem;
	}
	.footlinks {
		display: none;
	}
	#footer .cooperate {
	    gap: 0 3rem;
	    margin-top: 3rem;
	}
	#footer .iso .logo img {
	    max-width: 24rem;
	}
	
}

/* !common
---------------------------------------------------------- */
#main-visual {
	overflow: hidden;
	position: relative;
}
.main-swiper {
	position: relative;
	z-index: 1;
}
.main-swiper .swiper-slide {
	height: calc(100vh - 10rem);
}
.main-swiper .swiper-slide img {
	object-fit: cover;
	width: 100%; 
	height: 100%;
	transition: 1s linear 2s;
	transform: scale(1.1, 1.1);
}
.main-swiper .swiper-slide-active img,
.main-swiper .swiper-slide-duplicate-active img {
	transition: 6s linear;
	transform: scale(1, 1);
}
#main-visual .main-head {
	display: flex;
	justify-content: center;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 2;
	padding: 22.8rem 5rem 4rem;
	width: 100%;
	background: linear-gradient(180deg, transparent 0%, #00AEEF 100%);
}
#main-visual .homeHeroHeadline_title h2 span, 
#main-visual .homeHeroHeadline_title div span {
	font-size: 8rem;
}
#main-visual .homeHeroHeadline_title h2 span:nth-child(2), 
#main-visual .homeHeroHeadline_title div span:nth-child(2) {
	margin-top: 0;
}
#main-visual .main-head .head {
	line-height: 1.45;
	color: #fff;
	font-weight: 600;
}

.homeHeroHeadline_title span {
    display: block;
    opacity: 0;
}

.animated .homeHeroHeadline_title span {
	opacity: 1;
}

.homeHeroHeadline_title span em {
    transform: rotateX(90deg) translateY(2.0833333333vw);
    will-change: transform,opacity;
    transition: 1.2s cubic-bezier(0.19, 1, 0.22, 1);
    opacity: 0;
    display: inline-block;
	font-style: normal;
}

.animated .homeHeroHeadline_title span em {
    transform: none;
    opacity: 1;
}

.homeHeroHeadline_title span em:nth-child(1) {
    transition-delay: 0.8s
}

.homeHeroHeadline_title span em:nth-child(2) {
    transition-delay: 0.83s
}

.homeHeroHeadline_title span em:nth-child(3) {
    transition-delay: 0.86s
}

.homeHeroHeadline_title span em:nth-child(4) {
    transition-delay: 0.89s
}

.homeHeroHeadline_title span em:nth-child(5) {
    transition-delay: 0.92s
}

.homeHeroHeadline_title span em:nth-child(6) {
    transition-delay: 0.95s
}
.homeHeroHeadline_title span em:nth-child(7) {
    transition-delay: 0.98s
}

.homeHeroHeadline_title span em:nth-child(8) {
    transition-delay: 1.01s
}

.homeHeroHeadline_title span em:nth-child(9) {
    transition-delay: 1.04s
}

.homeHeroHeadline_title span em:nth-child(10) {
    transition-delay: 1.07s
}

.homeHeroHeadline_title span em:nth-child(11) {
    transition-delay: 1.1s
}

.homeHeroHeadline_title span em:nth-child(12) {
    transition-delay: 1.13s
}

.homeHeroHeadline_title span em:nth-child(13) {
    transition-delay: 1.16s
}

.homeHeroHeadline_title span em:nth-child(14) {
    transition-delay: 1.19s
}

.homeHeroHeadline_title span em:nth-child(15) {
    transition-delay: 1.22s
}

.homeHeroHeadline_title span em:nth-child(16) {
    transition-delay: 1.25s
}

.homeHeroHeadline_title span em:nth-child(17) {
    transition-delay: 1.28s
}

.homeHeroHeadline_title span em:nth-child(18) {
    transition-delay: 1.31s
}

.homeHeroHeadline_title span em:nth-child(19) {
    transition-delay: 1.34s
}

.homeHeroHeadline_title span em:nth-child(20) {
    transition-delay: 1.37s
}

.homeHeroHeadline_title span em:nth-child(21) {
    transition-delay: 1.4s
}

.homeHeroHeadline_title span em:nth-child(22) {
    transition-delay: 1.43s
}

.homeHeroHeadline_title span em:nth-child(23) {
    transition-delay: 1.46s
}

.homeHeroHeadline_title span em:nth-child(24) {
    transition-delay: 1.49s
}

.homeHeroHeadline_title span em:nth-child(25) {
    transition-delay: 1.52s
}

.homeHeroHeadline_title span em:nth-child(26) {
    transition-delay: 1.55s
}

.homeHeroHeadline_title span em:nth-child(27) {
    transition-delay: 1.58s
}

.homeHeroHeadline_title span em:nth-child(28) {
    transition-delay: 1.61s
}

.homeHeroHeadline_title span em:nth-child(29) {
    transition-delay: 1.64s
}

.homeHeroHeadline_title span em:nth-child(30) {
    transition-delay: 1.67s
}

.homeHeroHeadline_title span em:nth-child(31) {
    transition-delay: 1.7s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(1) {
    transition-delay: 1s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(2) {
    transition-delay: 1.03s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(3) {
    transition-delay: 1.06s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(4) {
    transition-delay: 1.09s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(5) {
    transition-delay: 1.12s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(6) {
    transition-delay: 1.15s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(7) {
    transition-delay: 1.18s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(8) {
    transition-delay: 1.21s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(9) {
    transition-delay: 1.24s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(10) {
    transition-delay: 1.27s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(11) {
    transition-delay: 1.3s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(12) {
    transition-delay: 1.33s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(13) {
    transition-delay: 1.36s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(14) {
    transition-delay: 1.39s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(15) {
    transition-delay: 1.42s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(16) {
    transition-delay: 1.45s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(17) {
    transition-delay: 1.48s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(18) {
    transition-delay: 1.51s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(19) {
    transition-delay: 1.54s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(20) {
    transition-delay: 1.57s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(21) {
    transition-delay: 1.6s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(22) {
    transition-delay: 1.63s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(23) {
    transition-delay: 1.66s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(24) {
    transition-delay: 1.69s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(25) {
    transition-delay: 1.72s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(26) {
    transition-delay: 1.75s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(27) {
    transition-delay: 1.78s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(28) {
    transition-delay: 1.81s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(29) {
    transition-delay: 1.84s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(30) {
    transition-delay: 1.87s
}

.homeHeroHeadline_title span:nth-child(2) em:nth-child(31) {
    transition-delay: 1.9s
}

#teaser {
	padding: 6rem 0 5rem;
}
#teaser .head-large {
	margin-bottom: 0;
}
#teaser .head-large .eng {
	font-size: 8rem;
}
#teaser .head-large .jap {
	font-size: 1.8rem;
}

#breadcrumb {
	padding: 2rem 0;
	color: #666;
	font-size: 1.2rem;
}
#breadcrumb ul {
	display: flex;
}
#breadcrumb li + li:before {
	content: "-";
	margin: 0 0.4rem;
}

.js-image-scroll {
	overflow: hidden;
	display: flex;
}
.js-image-scroll ul {
	display: flex;
	align-items: flex-start;
}
.js-image-scroll ul:nth-child(odd) {
	animation-name: image-loop-left1;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.js-image-scroll ul:nth-child(even) {
    animation-name: image-loop-left2;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
@keyframes image-loop-left1 {
	0% {
	    transform: translateX(100%);
	}
	100% {
	    transform: translateX(-100%);
	}
}
@keyframes image-loop-left2 {
	0% {
	    transform: translateX(0);
	}
	100% {
	    transform: translateX(-200%);
	}
}
.txt-swiper li {
	overflow: hidden;
	padding-right: 6.6rem;
	width: 105rem;
	text-align: center;
}

.inner,
.inner-small {
	margin: 0 auto;
	padding: 0 5rem;
	max-width: 130rem;
}
.inner-small {
	max-width: 110rem;
}

.font-mont {
	text-transform: uppercase;
	font-family: YakuHanJP, "Montserrat", sans-serif;
}

.head-large {
	margin-bottom: 5rem;
}
.head-large .eng {
	margin-bottom: 1.6rem;
	white-space: nowrap;
	word-wrap: break-word;
	word-break:break-all;
	line-height: 1;
	font-size: 6rem;
	font-weight: 700;
}
.head-large .jap {
	line-height: 1;
	font-size: 2.4rem;
	font-weight: 600;
}

.btn-link {
	margin-top: 4rem;
	font-size: 0;
}
.btn-link .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 6.4rem;
	width: 100%;
	max-width: 30rem;
	background: #00AEEF;
	border-radius: 3.2rem;
	border: 0;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 600;
}
.btn-link .edit {
	background: #fff;
	border: 1px solid #ccc;
	color: #00AEEF;
}

.ta-cen {
	text-align: center;
}

.anchor-area {
	position: relative;
}
.anchor-area .anchor {
	position: absolute;
	top: -10rem;
}

.service-contactrecruit {
	padding: 3rem 0;
	background: url(../img/common/bg_contact.jpg)no-repeat center;
	background-size: cover;
}
.service-contactrecruit .link {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}
.service-contactrecruit .link a {
	padding: 5rem;
	background: rgba(0, 174, 239, 0.9);
	color: #fff;
}
.service-contactrecruit .link .txt {
	line-height: 1.4375;
	font-weight: 500;
	font-size: 1.6rem;
}
.service-contactrecruit .link .head-large {
	margin-bottom: 3.5rem;
}

.contact-wrap {
	padding: 0 0 6rem;
	line-height: 2;
	font-size: 1.4rem;
}
.contact-wrap h3 {
	margin-bottom: 2.2rem;
	font-size: 1.8rem;
	font-weight: 600;
}
.contact-wrap p + .table-form {
	margin-top: 2rem;
}
.table-form {
	padding: 6rem;
	background: #F9F9F9;
	border: 1px solid #ccc;
	line-height: 2;
	font-size: 1.4rem;
}
.table-form .title {
	margin-bottom: 2rem;
	text-align: center;
}
.table-form .title h3 {
	margin-bottom: 1rem;
	line-height: 1.4375;
	font-size: 3.2rem;
	font-weight: 600;
}
.table-form .must {
	display: inline-block;
	padding: 0.6rem 1rem;
	background: #F9ED31;
	border-radius: 1.2rem;
	line-height: 1;
	font-size: 1.2rem;
	font-weight: 400;
}
.table-form table {
	width: 100%;
}
.table-form th {
	vertical-align: top;
	padding: 2rem 0;
	width: 22rem;
	text-align: left;
	font-weight: 600;
}
.table-form td {
	vertical-align: top;
	padding: 1rem 0;
}
.table-form th .must {
	margin-left: 1rem;
}
.table-form .col2 {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
}
.table-form .col2 .item {
	width: 100%;
	max-width: calc(50% - 1rem);
}
.table-form input::-webkit-input-placeholder,
.table-form textarea::-webkit-input-placeholder {
	color:#E0E0E0!important;
}
.table-form input::-moz-placeholder,
.table-form textarea::-moz-input-placeholder{
	color: #E0E0E0!important;
}

.table-form select,
.table-form input,
.table-form textarea {
	padding: 0 1rem;
	width: 100%;
	height: 5rem;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 0.4rem;
}
.table-form select {
	background: url(../img/common/icon_select.svg)no-repeat right 1rem center #fff;
	background-size: 2.4rem;
}
.table-form textarea {
	display: block;
	padding: 1rem;
	height: 32rem;
}
.table-form .small {
	width: 8rem;
}
.table-form .btn-link .btn {
	margin: 0 1.5rem;
}

.confirm.table-form th,
.confirm.table-form td {
	padding: 2rem 0;
}


/*** hover ***/
@media screen and (min-width: 960px) {
	.service-contactrecruit .link a:hover {
		background: rgba(0, 174, 239, 1);
	}
	
	.btn-link .btn:hover {
		opacity: 0.7;
	}
	
	#breadcrumb li a:hover {
		color: #00AEEF;
	}
}
/* sp */
@media only screen and (max-width : 767px){
	.inner,
	.inner-small {
		padding: 0 2rem;
	}
	
	.main-swiper .swiper-slide {
	    height: 32rem;
	}
	#main-visual .main-head {
	    padding: 11rem 2rem 2rem;
	}
	#main-visual .homeHeroHeadline_title h2 span,
	#main-visual .homeHeroHeadline_title div span {
		font-size: 2.4rem;
	}
	
	#teaser {
	    padding: 4rem 0;
	}
	#teaser .head-large .eng {
		font-size: 4.8rem;
	}
	
	.txt-swiper li {
		padding-right: 3rem;
		width: 40rem;
	}
	
	.head-large {
		margin-bottom: 4.5rem;
	}
	.head-large .eng {
		margin-bottom: 1rem;
		font-size: 4rem;
	}
	.head-large .jap {
		font-size: 1.8rem;
	}
	
	.btn-link {
		text-align: center;
	}
	
	.service-contactrecruit {
	    background-image: url(../img/common/bg_contact_sp.jpg);
	}
	.service-contactrecruit .link {
	    grid-template-columns: repeat(1, 1fr);
	}
	.service-contactrecruit .link a {
	    padding: 4rem;
		font-size: 1.6rem;
	}
	
	.table-form {
	    padding: 1rem;
	}
	.table-form .title {
		margin: 1rem 0 2rem;
	}
	.table-form .title h3 {
		font-size: 2.4rem;
	}
	.table-form th {
		display: block;
		padding: 0 0 0.6rem;
		width: 100%;
	}
	.table-form td {
		display: block;
		padding: 0 0 1.5rem;
		width: 100%;
	}
	.table-form .col2 {
		gap: 1rem;
	}
	.table-form .col2 .item {
	    max-width: 100%;
	}
	.table-form select,
	.table-form input,
	.table-form textarea {
		padding: 0 1rem;
		height: 4rem;
	}
	.table-form textarea {
		padding: 1rem;
		height: 20rem;
	}
	.table-form .btn-link {
	    margin-top: 2rem;
	}
	.table-form .btn-link .btn {
	    margin: 0.5rem 0;
	}
	
	.confirm.table-form th {
		padding: 0 0 0.6rem;
	}
	.confirm.table-form td {
		padding: 0 0 2rem;
	}
}


/* !page
---------------------------------------------------------- */
.top-company-display {
	position: relative;
	padding: 8rem 0;
}
.top-company-display .head-large {
	margin-bottom: 6.2rem;
}
.top-company-display .info {
	padding: 12rem 0;
	width: calc(50% - 4rem);
}
.top-company-display .img {
	position: absolute;
	top: 8rem;
	bottom: 8rem;
	right: 0;
	width: 50%;
}
.top-company-display .img img {
	object-fit: cover;
	object-position: left center;
	width: 100%;
	height: 100%;
}
.top-company-display .sub {
	margin-bottom: 2.8rem;
	line-height: 1.4375;
	font-size: 3.2rem;
	font-weight: 600;
}

.top-services {
	padding: 8rem 0;
	background: #F2F2F2;
}
.services-construction {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}
.services-construction li {
	background: #fff;
}
.services-construction .img {
	position: relative;
	overflow: hidden;
	padding-top: 61%;
}
.services-construction .img img {
	object-fit: cover;
	position: absolute;
	left: 0;
	top: 0;
	transition-duration: 0.3s;
	width: 100%;
	height: 100%;
}
.services-construction .tit {
	padding: 1.5rem 1rem;
	text-align: center;
	font-size: 2rem;
	font-weight: 600;
}

.top-instagram {
	padding: 8rem 0;
}
.instagram-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 2rem;
}
.top-instagram .link {
	margin-top: 1rem;
	text-align: right;
}
.top-instagram .link a {
	display: inline-block;
	padding-left: 3.0rem;
	background: url(../img/common/icon_instagram.svg)no-repeat left center;
	/* background-size: 2.4rem; */
	background-size: contain;
	color: #666666;
	font-size: 1.4rem;
}

/* company.html */
.company-message .display {
	display: flex;
	justify-content: space-between;
}
.company-message .display .img {
	width: calc(50% - 4rem);
}
.company-message .display .info {
	width: calc(50% - 2rem);
	line-height: 2;
	font-size: 1.4rem;
}
.company-message .display .info p + p {
	margin-top: 2rem;
}
.company-message .display .end {
	text-align: right;
}
.company-details {
	padding: 8rem 0 0;
}
.company-details .details {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 4rem;
}
.company-details .details table {
	width: 100%;
	line-height: 2;
}
.company-details .details th {
	padding: 2rem;
	width: 20rem;
	background: rgba(0, 174, 239, 0.1);
	border-top: 1px solid #00AEEF;
	border-bottom: 1px solid #00AEEF;
	text-align: left;
	font-size: 1.4rem;
	font-weight: 600;
}
.company-details .details td {
	padding: 2rem;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	font-size: 1.4rem;
}

.company-access {
	padding: 8rem 0 0;
}
.company-access .map iframe {
	width: 100%;
	height: 54.6rem;
}

.company-history {
	padding: 8rem 0;
}
.history-line {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 4.2rem;
}
.history-line ul {
	overflow: hidden;
}
.history-line li {
	position: relative;
	padding: 0 0 4rem 6.2rem;
	line-height: 2;
	font-size: 1.4rem;
}
.history-line li:last-child {
	padding-bottom: 0;
}
.history-line li:before {
	content: "";
	position: absolute;
	left: 1.9rem;
	top: 0;
	width: 2.4rem;
	height: 2.4rem;
	background: #C3EFFF;
	border-radius: 50%;
}
.history-line li:after {
	content: "";
	position: absolute;
	left: 3rem;
	top: 0;
	height: 100%;
	border-left: 2px solid #C3EFFF;
}
.history-line ul:nth-of-type(2) li:last-child:after {
	content: none;
}
.history-line .year {
	margin-bottom: 0.6rem;
	line-height: 1.2;
	font-size: 2.4rem;
	font-weight: 700;
}

/* service.html */
.service-about {
	padding: 5rem 0 8rem;
}
.service-about .sub {
	margin-bottom: 3rem;
	line-height: 1.4375;
	font-size: 3.2rem;
	font-weight: 600;
}

.service-introd-list {
	border-top: 1px solid #ccc;
}
.service-introd-list li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 3rem 0;
	border-bottom: 1px solid #ccc;
}
.service-introd-list li .img {
	width: calc(50% - 1rem);
}
.service-introd-list li .info {
	width: calc(50% - 4rem);
	line-height: 2;
	font-size: 1.4rem;
}
.service-introd-list .head {
	margin-bottom: 3rem;
	line-height: 1.2;
	font-weight: 600;
	font-size: 2.6rem;
}
.service-introd-list .step {
	margin-bottom: 4rem;
	font-weight: 700;
	font-size: 4rem;
}

.service-flow {
	padding: 8rem 0 5.6rem;
	background: #F2F2F2;
}
.service-flow .flow-introd {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 4rem;
}
.flow-introd li {
	text-align: center;
	line-height: 1.857;
	font-size: 1.4rem;
}
.flow-introd .pic {
	position: relative;
	padding-top: 100%;
	margin-bottom: 2rem;
	overflow: hidden;
	border-radius: 50%;
}
.flow-introd .pic img {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.flow-introd .step {
	margin-bottom: 2rem;
	line-height: 1;
	font-size: 2.6rem;
	font-weight: 700;
}

/* recruit.html */
.recruit-wrap .company-message {
	padding: 6rem 0 8rem;
}
.recruit-wrap .company-message .display {
	align-items: center;
}
.company-message .sub {
	line-height: 1.46;
	color: #00AEEF;
	font-size: 2.8rem;
	font-weight: 600;
}

.recruit-form {
	padding: 7rem 0 5rem;
}

/*** hover ***/
@media screen and (min-width: 960px) {
	.services-construction li a:hover img {
		transform: scale(1.1, 1.1);
	}
	
	.top-instagram .link a:hover {
		opacity: 0.7;
	}
	
}
/* sp */
@media only screen and (max-width : 767px){
	.top-company-display {
	    padding: 6rem 0 8.8rem;
	}
	.top-company-display .info {
	    padding: 0;
	    width: auto;
	}
	.top-company-display .img {
		position: static;
		margin: 4rem -2rem 0 0;
		width: auto;
	}
	.top-company-display .head-large {
	    margin-bottom: 3.5rem;
	}
	.top-company-display .sub {
	    margin-bottom: 3rem;
	}
	
	.top-services {
	    padding: 7.3rem 0 9.4rem;
	}
	.services-construction {
	    grid-template-columns: repeat(1, 1fr);
	}
	.services-construction .tit {
	    padding: 1.2rem 1rem;
	    font-size: 1.8rem;
	}
	
	.top-instagram {
	    padding: 6.6rem 0 6rem;
	}
	.instagram-list {
	    grid-template-columns: repeat(2, 1fr);
	    gap: 0.9rem;
	}
	
	/* company.html */
	.company-message .display {
	    display: block;
	}
	.company-message .display .logo {
		margin-bottom: 2rem;
	    width: auto;
		text-align: center;
	}
	.company-message .display .logo img {
		width: 28rem;
	}
	.company-message .display .info {
	    width: auto;
	}
	
	.company-details,
	.company-access {
	    padding: 6rem 0 0;
	}
	.company-details .head-large .eng {
		font-size: 3.2rem;
	}
	.company-details .details {
	    grid-template-columns: repeat(1, 1fr);
	}
	.company-details .details .item + .item {
		margin-top: -1px;
	}
	.company-details .details th {
	    padding: 1rem;
	    width: 12rem;
	}
	.company-details .details td {
	    padding: 1rem;
	}
	.company-access .map iframe {
	    height: 28rem;
	}
	
	.company-history {
	    padding: 6rem 0;
	}
	.history-line {
	    grid-template-columns: repeat(1, 1fr);
	}
	.history-line li {
		padding-left: 4.8rem;
	}
	.history-line ul:first-child li {
		padding-bottom: 4rem;
	}
	.history-line li:before {
		left: 1.2rem;
	}
	.history-line li:after {
		left: 2.3rem;
	}
	
	.service-about {
	    padding: 5rem 0;
	}
	.service-about .sub {
		font-size: 2.4rem;
	}
	
	.service-introd-list li {
	    display: block;
	    padding: 2rem 0;
	}
	.service-introd-list li .img {
		margin-bottom: 2rem;
		width: auto;
	}
	.service-introd-list li .info {
		width: auto;
	}
	.service-introd-list .head {
	    margin-bottom: 1.6rem;
	    font-size: 1.8rem;
	}
	.service-introd-list .step {
	    margin-bottom: 2rem;
	    font-size: 2.4rem;
	}
	
	.service-flow {
	    padding: 6rem 0;
	}
	.service-flow .flow-introd {
	    grid-template-columns: repeat(2, 1fr);
	    gap: 2rem;
	}
	.flow-introd li {
		font-size: 1.2rem;
	}
	.flow-introd .step {
	    margin-bottom: 1.2rem;
	    font-size: 1.8rem;
	}
	
	/* recruit.html */
	.recruit-wrap .company-message {
	    padding: 5rem 0;
	}
	.company-message .sub {
		font-size: 2rem;
	}
	.recruit-form {
	    padding: 6rem 0;
	}
}

span.error {
	color: #f00;
	display: block;
}