@charset "utf-8";

/*		Contents
---------------------------------------------------------------------------
	h要素（見出し）
	paging（ページング）
	widget_title（ページタイトル）
	widget_btn（ボタン）
	widget_bnr（バナー）
	widget_col2（2カラム）
	content_contact（コンテンツ：お問い合わせ）
------------------------------------------------------------------------ */

/* ========================================================================
	h要素（見出し）
======================================================================== */

/* ----------------------------------------
	h_01
---------------------------------------- */
.h_01{
	margin:0 0 100px 0;
	font-weight:700;
}

.h_01 .ja{
	display:block;
	font-size:5.0rem;
	line-height:7.0rem;
}

.h_01 .en{
	display:block;
	position:relative;
	margin:16px 0 0 0;
	padding:0 0 0 34px;
	font-family:"Kreadon", sans-serif;
	font-size:3.6rem;
	color:#7498b3;
	line-height:3.8rem;
}

.h_01 .en::before,
.h_01 .en::after{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:10px;
	height:24px;
	background:#3a3a3a;
}
.h_01 .en::after{
	top:27px;
	height:11px;
	background:#7498b3;
}

@media screen and (max-width:767px){
.h_01{
	margin:0 0 40px 0;
}

.h_01 .ja{
	font-size:3.0rem;
	line-height:5.0rem;
}

.h_01 .en{
	margin:10px 0 0 0;
	padding:0 0 0 20px;
	font-size:2.4rem;
	line-height:3.0rem;
}

.h_01 .en::before,
.h_01 .en::after{
	width:5px;
	height:19px;
}
.h_01 .en::after{
	top:22px;
	height:8px;
}
}


/* ----------------------------------------
	h_02
---------------------------------------- */
.h_02{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:0 30px;
	margin:0 0 100px 0;
	padding:17px 32px 17px 46px;
	background:#eaeff3;
	border-left:8px solid #7498b3;
	line-height:1;
}

.h_02 .ja{
	flex:1;
	font-size:3.0rem;
	font-weight:700;
	line-height:4.0rem;
}

.h_02 .en{
	display:block;
	font-family:"Kreadon", sans-serif;
	font-size:1.6rem;
	font-weight:600;
	color:#7498b3;
}

@media screen and (max-width:767px){
.h_02{
	gap:0 20px;
	margin:0 0 40px 0;
	padding:15px 20px;
	border-width:4px;
}

.h_02 .ja{
	font-size:2.0rem;
	line-height:3.0rem;
}

.h_02 .en{
	font-size:1.4rem;
}
}


/* ========================================================================
	paging（ページング）
======================================================================== */
.paging{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:20px;
	margin:0 0 200px 0;
	font-weight:500;
}

.paging span.dots{
	display:flex;
	align-items:center;
	height:50px;
	margin:0 10px;
	line-height:1;
}

.paging span.current,
.paging a{
	display:flex;
	justify-content:center;
	align-items:center;
	width:50px;
	height:50px;
	background:#eff1f3;
	color:#1c375f;
	line-height:1;
	text-decoration:none;
}
.paging span.current,
.paging a:hover{ background:#1c375f; color:#ffffff; }

@media screen and (max-width:767px){
.paging{
	gap:20px 10px;
	margin:0 0 60px 0;
}

.paging span.dots{
	height:40px;
	margin:0;
}

.paging span.current,
.paging a{
	width:40px;
	height:40px;
}
}


/* ========================================================================
	widget_title（ページタイトル）
======================================================================== */
.widget_title{
	position:relative;
}

.widget_title::before{
	content:"";
	position:absolute;
	top:-104px;
	left:0;
	width:100%;
	height:700px;
	background:url(../../img/common/bg_title01.png) no-repeat center bottom;
	background-size:cover;
}

.widget_title::after{
	content:"";
	position:absolute;
	top:-14px;
	right:0;
	width:500px;
	height:528px;
	background:url(../../img/common/bg_title02.png) no-repeat center;
}

.widget_title h1{
	position:relative;
	max-width:1680px;
	min-height:596px;
	margin:0 auto;
	padding:130px 40px 0;
	font-weight:700;
	line-height:1;
	z-index:1;
}

.widget_title h1 .en{
	display:block;
	font-family:"Kreadon", sans-serif;
	font-size:18.6rem;
	color:#7498b3;
}
#identity .widget_title h1 .en,
#privacy .widget_title h1 .en{ font-size:clamp(12.0rem, 9.375vw, 18.0rem); } /* 1920px */

.widget_title h1 .ja{
	display:flex;
	align-items:center;
	gap:0 40px;
	margin:15px 0 0 14px;
	font-size:3.6rem;
}

.widget_title h1 .ja::after{
	content:"";
	width:158px;
	height:1px;
	background:#7498b3;
}

@media screen and (max-width:767px){
.widget_title{
	display:flex;
	align-items:center;
	min-height:300px;
	padding:20px 0 40px 0;
}

.widget_title::before{
	top:-80px;
	height:350px;
}

.widget_title::after{
	top:-10px;
	right:0;
	width:250px;
	height:264px;
	background-size:100%;
}

.widget_title h1{
	max-width:none;
	min-height:auto;
	margin:0;
	padding:0 20px;
}

.widget_title h1 .en{
	font-size:min(15.625vw, 12.0rem); /* 768px */
}
#identity .widget_title h1 .en,
#privacy .widget_title h1 .en{ font-size:min(15.625vw, 12.0rem); /* 768px */ }

.widget_title h1 .ja{
	margin:20px 0 0 0;
	font-size:2.4rem;
	line-height:3.4rem;
}
.widget_title h1 .ja::after{ content:none; }
}


/* ========================================================================
	widget_btn（ボタン）
======================================================================== */
.widget_btn{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:40px;
	margin:0 0 100px 0;
}

.widget_btn a,
.widget_btn button{
	overflow:hidden;
	position:relative;
	background:#7498b3;
	border-radius:5px;
	font-size:2.6rem;
	font-weight:700;
	color:#ffffff;
	line-height:3.4rem;
	text-decoration:none;
	transition:all 0.4s ease;
}
.widget_btn .black{ background:#3a3a3a; }

.widget_btn a:hover,
.widget_btn button:hover{
	color:#3a3a3a;
}

.widget_btn a::before,
.widget_btn button::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#dedede;
	transform:scaleX(0);
	transform-origin:right;
	transition:all 0.4s ease;
	transition-property:transform;
}
.widget_btn a:hover::before,
.widget_btn button:hover::before{
	transform:scaleX(1);
	transform-origin:left;
}

.widget_btn span{
	display:flex;
	justify-content:center;
	align-items:center;
	position:relative;
	min-width:430px;
	min-height:100px;
	padding:0 76px;
}

.widget_btn span::before{
	content:"";
	position:absolute;
	top:50%;
	right:18px;
	width:40px;
	height:40px;
	background:#ffffff;
	border-radius:50%;
	transform:translateY(-50%);
}

.widget_btn span::after{
	content:"";
	position:absolute;
	top:0;
	right:29px;
	width:18px;
	height:100%;
	background:url(../../img/common/arrow_01.png) no-repeat center;
	background-size:18px auto;
	transition-duration:0.4s;
	filter:invert(63%) sepia(9%) saturate(1312%) hue-rotate(163deg) brightness(92%) contrast(83%);
}
.widget_btn span:hover::after{ filter:none; }

@media screen and (max-width:767px){
.widget_btn{
	gap:20px;
	margin:0 0 40px 0;
}

.widget_btn a,
.widget_btn button{
	width:100%;
}

.widget_btn span{
	min-width:auto;
	min-height:auto;
	padding:16px 50px 16px 20px;
	font-size:1.8rem;
	line-height:2.6rem;
}

.widget_btn span::before{
	right:10px;
	width:30px;
	height:30px;
}

.widget_btn span::after{
	right:20px;
	width:10px;
	background-size:100%;
}
}


/* ========================================================================
	widget_bnr（バナー）
======================================================================== */
.widget_bnr{
	padding:0 0 40px 0;
}

.widget_bnr a{
	display:flex;
	flex-direction:column;
	justify-content:center;
	position:relative;
	min-height:370px;
	margin:0 0 60px 0;
	padding:0 168px 0 117px;
	background:url(../../img/common/bg_company.jpg) no-repeat center;
	background-size:cover;
	color:#ffffff;
	text-decoration:none;
}
.widget_bnr .recruit a{ background-image:url(../../img/common/bg_recruit.jpg); }

.widget_bnr a::before{
	content:"";
	position:absolute;
	top:50%;
	right:44px;
	width:82px;
	height:82px;
	border:1px solid #ffffff;
	border-radius:50%;
	transform:translateY(-50%);
}

.widget_bnr a::after{
	content:"";
	position:absolute;
	top:0;
	right:77px;
	width:18px;
	height:100%;
	background:url(../../img/common/arrow_01.png) no-repeat center;
	background-size:18px auto;
	filter:invert(100%) sepia(0%) saturate(27%) hue-rotate(146deg) brightness(105%) contrast(100%);
}

.widget_bnr h3{
	position:relative;
	padding:9px 0 8px 0;
	font-size:4.0rem;
	font-weight:700;
	line-height:1;
}

.widget_bnr p{
	position:relative;
	padding:8px 0 9px 0;
	font-weight:500;
}

.widget_bnr h3::before,
.widget_bnr p::before{
	content:"";
	position:absolute;
	top:0;
	left:-31px;
	width:1px;
	height:100%;
	background:#ffffff;
}

@media screen and (max-width:767px){
.widget_bnr{
	padding:0;
}

.widget_bnr a{
	min-height:162px;
	margin:0 0 20px 0;
	padding:20px 50px 20px 30px;
}

.widget_bnr a::before{
	right:10px;
	width:30px;
	height:30px;
}

.widget_bnr a::after{
	right:20px;
	width:10px;
	background-size:100%;
}

.widget_bnr h3{
	padding:5px 0 10px 0;
	font-size:2.4rem;
}

.widget_bnr p{
	padding:5px 0;
	font-size:1.4rem;
	line-height:2.4rem;
}

.widget_bnr h3::before,
.widget_bnr p::before{
	left:-15px;
}
}


/* ========================================================================
	widget_col2（2カラム）
======================================================================== */
.widget_col2{
	display:flex;
	justify-content:flex-end;
	position:relative;
	max-width:1680px;
	min-height:478px;
	margin:0 auto 200px;
	padding:300px 40px 0;
}

.widget_col2 .key{
	position:absolute;
	top:0;
	left:40px;
}

.widget_col2 dl{
	position:relative;
	width:850px;
	padding:80px 72px;
	background:rgba(255,255,255,0.9);
	border:1px solid #cccccc;
}

.widget_col2 dl dt{
	margin:0 0 20px 0;
	font-size:3.4rem;
	font-weight:700;
	line-height:5.4rem;
}

.widget_col2 dl dt span{
	background:linear-gradient(transparent 67.4%, #d9e3ed 0%);
}

.widget_col2 dl dd{
	line-height:4.0rem;
}

@media screen and (max-width:767px){
.widget_col2{
	display:block;
	max-width:none;
	min-height:auto;
	margin:0 auto 60px;
	padding:0 20px;
}

.widget_col2 .key{
	position:static;
}

.widget_col2 dl{
	width:auto;
	padding:30px 20px;
}

.widget_col2 dl dt{
	font-size:2.0rem;
	line-height:3.0rem;
}

.widget_col2 dl dd{
	line-height:2;
}
}


/* ========================================================================
	content_contact（コンテンツ：お問い合わせ）
======================================================================== */
.content_contact{
	overflow:hidden;
	position:relative;
	margin:0 0 200px 0;
	padding:44px 0 94px 0;
	text-align:center;
}

.content_contact::before{
	content:"";
	position:absolute;
	bottom:0;
	left:50%;
	width:1400px;
	height:100%;
	background:#7498b3;
	border-radius:5px;
	transform:translateX(-50%);
}

.content_contact h2{
	margin:0 0 40px 0;
	font-weight:700;
	line-height:1;
}

.content_contact h2 .en{
	display:block;
	font-size:20.0rem;
	color:#e9e9e9;
}

.content_contact h2 .ja{
	display:inline-block;
	padding:12px 6px 20px;
	border-bottom:2px solid #ffffff;
	font-size:3.6rem;
	color:#ffffff;
}

.content_contact p{
	margin:0 0 36px 0;
	font-size:2.2rem;
	font-weight:500;
	line-height:3.6rem;
	color:#ffffff;
}

@media screen and (max-width:767px){
.content_contact{
	margin:0 0 60px 0;
	padding:40px 0;
}

.content_contact h2{
	margin:0 0 30px 0;
}

.content_contact h2 .en{
	font-size:min(13.3333vw, 20.0rem); /* 1500px */
}

.content_contact h2 .ja{
	padding:15px 6px 10px;
	font-size:2.4rem;
}

.content_contact p{
	margin:0 0 30px 0;
	text-align:left;
	font-size:1.8rem;
	line-height:3.2rem;
}
}


/* ----------------------------------------
	btn
---------------------------------------- */
.content_contact .btn{
	display:flex;
	flex-wrap:wrap;
	padding:40px 10px 60px;
	background:#ffffff;
	border-radius:5px;
}

.content_contact .btn dl{
	width:50%;
	padding:25px 50px 30px;
	border-left:1px solid #3a3a3a;
}
.content_contact .btn dl:first-child{ border:none; }

.content_contact .btn dl dt{
	margin:0 0 25px 0;
	font-size:2.6rem;
	font-weight:700;
	line-height:3.6rem;
}

.content_contact .btn a{
	display:flex;
	align-items:center;
	position:relative;
	width:100%;
	height:118px;
	padding:0 46px 0 22px;
	background:#3a3a3a;
	border-radius:5px;
	font-size:2.8rem;
	font-weight:700;
	color:#ffffff;
	line-height:1;
	text-decoration:none;
}

.content_contact .btn a::before{
	content:"";
	position:absolute;
	top:0;
	right:16px;
	width:14px;
	height:100%;
	background:url(../../img/common/arrow_02.png) no-repeat center;
	filter:invert(100%) sepia(0%) saturate(27%) hue-rotate(146deg) brightness(105%) contrast(100%);
}

.content_contact .btn a > img{
	margin:0 32px 0 0;
}

@media screen and (max-width:767px){
.content_contact .btn{
	display:block;
	padding:10px 20px;
}

.content_contact .btn dl{
	width:auto;
	padding:30px 0;
	border-left:none;
	border-top:1px solid #3a3a3a;
}

.content_contact .btn dl dt{
	margin:0 0 20px 0;
	font-size:2.0rem;
	line-height:3.0rem;
}

.content_contact .btn a{
	justify-content:center;
	height:80px;
	padding:0 46px 0 20px;
	font-size:2.0rem;
	line-height:2.8rem;
}

.content_contact .btn a::before{
	width:10px;
	background-size:100%;
}

.content_contact .btn a > img{
	width:45px;
	margin:0 20px 0 0;
}
}


/* tel
---------------------------------------- */
.content_contact .btn .tel a{
	flex-direction:column;
	justify-content:center;
	padding:0;
	font-size:1.6rem;
	font-weight:500;
}
.content_contact .btn .tel a::before{ content:none; }

.content_contact .btn .tel span{
	margin:0 0 14px 0;
	font-size:3.4rem;
	font-weight:600;
}

.content_contact .btn .tel span img{
	margin:0 12px 2px 0;
	opacity:1;
}

@media screen and (max-width:767px){
.content_contact .btn .tel a{
	font-size:1.4rem;
	line-height:1;
}

.content_contact .btn .tel span{
	margin:0 0 10px 0;
	font-size:2.4rem;
}

.content_contact .btn .tel span img{
	width:20px;
	margin:0 10px 2px 0;
}
}