@charset "UTF-8";

/*
Theme Name: コスモス
Author: VELDOM Inc.
Description: 2024.06
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;400;500&family=Zen+Kaku+Gothic+New:wght@400;500&display=swap');


/*reset.css
---------------------------------------------------------- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,input,button,textarea,h1,h2,h3,h4,h5,h6 {
	margin: 0;
	padding: 0;
	border: 0;
	font-style: normal;
	vertical-align: baseline;
	box-sizing: border-box;
}

button,input,textarea {
	padding: 0;
	outline: none;
	appearance: none;
	background: none;
	border: none;
}

article,aside,details,figcaption,figure,picture,footer,header,hgroup,menu,nav,section { display: block;}

/*基本設定
---------------------------------------------------------- */
html {
	margin-top: 0 !important;
	width: 100%;
	height: 100%;
	min-height: 100%;
	font-size: 62.5%;
}

body {
	position: relative;
	width: 100%;
	height: 100%;
	background: #fff;
	color: #545454;
	line-height: 1.25;
	letter-spacing: 0.05em;
	font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 1.6rem;
	*font-size: small;
	*font: x-small;
	counter-reset: number 0;
}

ul,ol {
	list-style: none;
}
ol {
	counter-reset: number 0;
}

a {
	text-decoration: none;
	color: #393939;
	transition: .5s;
}
a:hover { opacity: .7;}

img { max-width: 100%;}
figure img { vertical-align: bottom;}

.en {
	line-height: 1;
	letter-spacing: 0.02em;
	font-family: "Outfit", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
}

._sp {
	display: none !important;
}

@media screen and (max-width: 768px) {
		._sp {
		display: block !important;
	}
	.flex_sp._sp,
	.btn._sp {
		display: flex !important;
	}
	.btn._sp.interbtn {
		width: calc(100% - 40px) !important;
    	margin: 0 auto;
	}
	._pc {
		display: none !important;
	}
	
	body {
		font-size: 1.5rem;
	}
}

.page__default-txt{
	font-size:20px;
	text-align:center;
	font-weight:700;
}

/* header
---------------------------------------------------------- */
.header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 30px 40px;
	z-index: 10;
}

.header_logo {
	height: 60px;
}
.header_menu._sp{
	width: 50px;
}
.header_nav__lists {
	column-gap: 20px;
}
.header_nav__list {
	position: relative;
}
.header_nav__list.partner_nav{
	background: #393939;
    border-radius:50px;
}
.header_nav__link {
	position: relative;
	display: block;
	padding: 0 15px 8px;
	text-align:center;
	line-height: 2;
	font-weight: 500;
	cursor: pointer;
	text-shadow: #fff 0 0 2px,#fff 0 0 2px,#fff 0 0 2px;
}
.header_nav__list.partner_nav .header_nav__link{
	color:#fff;
	padding:14px 20px 17px;
}
.header_nav__link::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: #616161;
	transition: all .3s;
	transform: scale(0, 1);
	transform-origin: left top;
}
.header_nav__link._current::after,
.header_nav__link:hover::after {
	transform: scale(1,1);
}

.header_nav__link._has-child {
	display: flex;
	align-items: center;
	justify-content:center;
	column-gap: 8px;
}
.header_nav__link._has-child::after {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	border-top: solid 1.5px #393939;
	border-right: solid 1.5px #393939;
	transform: rotate(135deg);
	transition: .5s;
}
.header_nav__link._has-child._active::after {
	margin-top: 5px;
	transform: rotate(-45deg);
}

.header_nav__btn {
	column-gap: 16px;
	padding: 20px;
	background: #fff;
	border: #b3b3b3 solid 1px;
	border-radius: 50vh;
	line-height: 1;
	font-weight: 500;
}

.header_subnav__lists {
	display: none;
	opacity: 0;
	visibility: hidden;
	transition: .5s;
}
.header_subnav__lists._active {
	position: absolute;
	top: 40px;
	left: 0;
	display: block;
	min-width: 100%;
	width: max-content;
	background: rgba(255,255,255,.7);
	opacity: 1;
	visibility: visible;
}
.header_subnav__list {
	border-top: #b3b3b3 solid 1px;
}
.header_subnav__list:first-child {
	border-top: none;
}

.header_subnav__link {
	display: block;
	width: 100%;
	padding: 10px 15px;
	font-size: 1.4rem;
}
@media screen and (max-width:1240px) {
	.header_nav__link{
		font-size:14px;
		column-gap:10px;
	}
}
@media screen and (max-width:1020px) {
	.header_nav__lists{

	}
	.header_nav__link{
		font-size:13px;
	}
}
@media screen and (max-width: 768px) {
	.header_nav {
		display: none;
		opacity: 0;
		visibility: hidden;
		transition: .5s;
	}
	.header_nav._active {
		position: fixed;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 100%;
		background: url(common/img/common/bg_gnav.jpg) no-repeat top center / cover;
		opacity: 1;
		visibility: visible;
		z-index: 5;
	}
	.header {
		padding: 20px;
		align-items: flex-start;
	}
	.header_logo {
		height: 28px;
		z-index: 20;
	}
	.header_subnav__lists._active{
		background:transparent;
		position:unset;
	}
	.header._active .header_logo img,
	.header._active .header_menu img {
		display: none !important;
		z-index: 20;
	}
	.header._active .header_logo {
		width: 37px;
		background: url(common/img/common/logo_sp_bk.svg) no-repeat center / contain;
	}
	.header._active .header_menu {
		width: 56px;
		height: 56px;
		background: url(common/img/common/ico_close.svg) no-repeat center / contain;
		z-index: 20;
	}
	
	/* nav */
	.header_nav {
		padding: 100px 20px 0;
		width: 100%;
	}
	.header_nav__list {
		width: 100%;
	}
	.header_nav__link {
		padding: 16px 0;
		border-bottom: solid 1px #B3B3B3;
		font-size: 1.7rem;
		font-weight: 400;
		line-height:1;
	}
	.header_nav__link._has-child {
		border-bottom: none;
	}
	.header_nav__link._has-child::after {
		display: none;
	}
	.header_subnav__lists {
		position: static;
		display: flex;
		flex-wrap: wrap;
		margin: -6px 0 0;
		padding-bottom: 16px;
		background: transparent;
		border-bottom: solid 1px #B3B3B3;
		opacity: 1;
		visibility: visible;
	}
	.header_subnav__list {
		border: none;
		width:100%;
	}
	.header_subnav__link {
		padding:6px 0;
		font-size: 1.4rem;
		text-align:center;
	}
	
	.header_nav__btn {
		width: 295px;
		margin:25px auto 0;
		box-shadow: 83px 56px 28px 0px rgba(0, 0, 0, 0.00), 53px 36px 26px 0px rgba(0, 0, 0, 0.01), 30px 20px 22px 0px rgba(0, 0, 0, 0.05), 13px 9px 16px 0px rgba(0, 0, 0, 0.09), 3px 2px 9px 0px rgba(0, 0, 0, 0.10);
		justify-content:center;
	}
	.header_nav__list.partner_nav{
		width:80%;
		margin:25px auto 0;
	}
	.header_nav__list.partner_nav .header_nav__link{
		font-size:16px;
		border-bottom:none;
		box-shadow: 83px 56px 28px 0px rgba(0, 0, 0, 0.00), 53px 36px 26px 0px rgba(0, 0, 0, 0.01), 30px 20px 22px 0px rgba(0, 0, 0, 0.05), 13px 9px 16px 0px rgba(0, 0, 0, 0.09), 3px 2px 9px 0px rgba(0, 0, 0, 0.10);
		border-radius:50px;
	}
}


/* main
---------------------------------------------------------- */
article .inr,
.w1280 {
	width: 1280px;
	margin: 0 auto;
}
.w960 {
	width: 960px;
	margin: 0 auto;
}


@media screen and (max-width: 768px) {
	article .inr,
	.w1280,
	.w960 {
		width: calc(100% - 40px);
	}
}

a.link {
	text-decoration: underline;
	color: #616161;
}
a.link.office_txt{
	line-height:1.5;
}
a.contact_f_link{
	position:relative;
	gap:20px;
}
a.contact_f_link::after{
    content: "";
    display: block;
    width: 53px;
    height: 53px;
    background: url(common/img/common/arw_circle_right.svg) no-repeat center / contain;
}
a.contact_f_link .specialty_ja{
	display:flex;
	align-items:flex-end;
	gap:10px;
}
a.contact_f_link .specialty_ja::before{
	content:attr(data-en);
	font-family:"Outfit", sans-serif;
	font-size:7rem;
	font-weight:900;
}
@media screen and (max-width:768px) {
	a.contact_f_link{
		flex-direction:row;
		align-items:center !important;
		justify-content:space-between !important;
	}
	a.contact_f_link::after{
		width:48px;
		height:48px;
	}
	a.contact_f_link .specialty_ja{
		flex-direction:column;
		align-items:flex-start;
	}
	a.contact_f_link .specialty_ja::before{
		font-size:2.5rem;
	}
}

/* ----------------------
  background
---------------------- */
.bg_wh { background: #fff; }

.bg_texture {
	overflow: hidden;
	background: #F3F3F3;
}
.bg_texture__inr {
	position: relative;
	z-index: 1;
}
.bg_texture__inr::before,
.bg_texture__inr::after {
	position: absolute;
	left: 0;
	content: "";
	display: block;
	width: 100%;
	height: 33.33vw;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top left;
	z-index: -1;
}
.bg_texture__inr::before{
	top: 0;
	background-image: url(common/img/common/bg_texture_top.jpg);
}
.bg_texture__inr::after {
	bottom: 0;
	background-image: url(common/img/common/bg_texture_bottom.jpg);
}

.bg_texture02 {
	position: relative;
}
.bg_texture02::before,
.bg_texture02::after {
	position: absolute;
	left: 0;
	content: "";
	display: block;
	width: 100%;
	height: 25vw;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top left;
	z-index: -1;
}
.bg_texture02::before{
	top: 0;
	background-image: url(common/img/common/bg_texture02_top.jpg);
}
.bg_texture02::after {
	bottom: 0;
	background-image: url(common/img/common/bg_texture02_bottom.jpg);
}

/* ----------------------
  title
---------------------- */
.ttl01 {
	column-gap: 24px;
}
.ttl01 .en{
	color: #000;
	line-height: 0.8;
	font-size: 12.0rem;
}
.ttl01 p {
	line-height: 1;
	letter-spacing: 0.05em;
	font-size: 2.4rem;
	font-weight: 500;
}

.ttl02 {
	margin-bottom: 2em;
	font-size: 2.8rem;
	font-weight: 500;
	line-height: 2;
}

.ttl03 {
	color: #393939;
}
.ttl03 .en {
	line-height: 1.25;
	font-size: 5.0rem;
	font-weight: 500;
}
.ttl03 p {
	margin-top: 10px;
	line-height: 2;
	font-size: 1.8rem;
}
.ttl03 .cstm_txt{
	font-size:2.8rem;
	font-weight:500;
}
@media screen and (min-width: 769px) {
	.news_info .ttl01 p{
		font-size:2.4rem !important;
	}
	.service_inr .ttl01 p{
		font-size:2.9rem;
	}
	.specialty_en{
		font-size:10rem !important;
	}
	/*サービス見出し*/
	.service .specialty_en{
		font-size:6.5rem !important;
	}
	.service .ttl01 p.specialty_ja{
		font-size:2rem !important;
	}
	/*インタビュー見出し*/
	.interview .en{
		font-size:7rem !important;
	}
	.interview .ttl01 p.specialty_ja{
		font-size:2rem !important;
	}
	
	/*ニュース見出し*/
	.news .specialty_en{
		font-size:7rem !important;
	}
	.news .ttl01 p.specialty_ja{
		font-size:2rem !important;
	}
	/*footer上 見出し*/
	.contact .en{
		font-size:7rem !important;
	}
	.contact .ttl01 p.specialty_ja{
		font-size:2rem !important;
	}
}
@media screen and (max-width: 768px) {
	.ttl01 .en {
		margin-bottom: 10px;
		font-size: 4.5rem;
		font-weight: 600;
	}
	.ttl01 .en.text80{
		font-size: 4.8rem !important;
	}
	.ttl01 .en.small_en{
		font-size:2.2rem !important;
	}
	.ttl01 p {
		font-size: 1.6rem;
	}
	.ttl03 .cstm_txt{
		font-size:1.8rem;
	}
	.ttl02 {
		margin-bottom: 32px;
		line-height: 1.75;
		font-size: 1.8rem;
	}
	
	.ttl03 .en {
		font-size: 4.2rem;
	}
	.ttl03 p {
		font-size: 1.4rem;
	}
	.interbtn{
		width: 95%;
    	margin: 0 auto !important;
	}
	.interbtn a{
		margin-left:0 !important;
	}
}


/* ----------------------
  button
---------------------- */
.btn {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: 10px;
}
.interbtn_pc {
	position: absolute;
    right: 13%;
    bottom: 20%;
    z-index: 5;
}
.btn a {
	display: flex;
	align-items: center;
	justify-content:center;
	width: 240px;
	margin-left: -20px;
	padding: 13px 20px;
	background: #fff;
	border-radius: 50vh;
	border: 1px solid #e1e1e1;
	box-shadow: 83px 56px 28px 0px rgba(0, 0, 0, 0.00), 53px 36px 26px 0px rgba(0, 0, 0, 0.01), 30px 20px 22px 0px rgba(0, 0, 0, 0.05), 13px 9px 16px 0px rgba(0, 0, 0, 0.09), 3px 2px 9px 0px rgba(0, 0, 0, 0.10);
	color: #616161;
	font-size: 1.5rem;
	font-weight: 500;
}
.btn a::after {
	/*content: "";*/
	content:none;
	width: 8px;
	height: 8px;
	border-radius: 4px;
	background: #616161;
}
@media screen and (max-width: 1400px) {
	.interbtn_pc{
		right: 11%;
    	bottom: 19%;
	}
	.interbtn_pc a{
		width: 220px;
	}
}
@media screen and (max-width: 1200px) {
	.interbtn_pc{
		right: 9%;
    	bottom: 18%;
	}
	.interbtn_pc a{
		font-size: 1.25rem;
	}
}
@media screen and (max-width: 1000px) {
	.interbtn_pc{
		right: 10px;
	}
	.interbtn_pc a{
		width: 200px;
	}
}
@media screen and (max-width: 768px) {
	.btn a {
		width: 100% !important;
		justify-content:center;
		gap:5px;
	}
}

/* ----------------------
  animation
---------------------- */
.js-fadeup {
  opacity: 0;
  visibility: hidden;
  transform: translateY(80px);
  transition: opacity 1s, visibility 1s, transform 1s;
}
.js-fadeup._active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}


.js-fadein {
  opacity: 0;
  visibility: hidden;
  transition: opacity 1s, visibility 1s, transform 1s;
}
.js-fadein._active {
  opacity: 1;
  visibility: visible;
}

/* ----------------------
  contact
---------------------- */
.contact {
	padding: 100px 0;
	background: url(common/img/common/bg_contact.jpg) no-repeat center / cover;
}
.contact_link {
	position: relative;
	flex: 1;
	padding-left: 79px;
	border-left: solid 2px #B3B3B3;
	line-height: 2;
}
.contact_link::after {
	position: absolute;
	right:20px;
	top: 50%;
	content: "";
	display: block;
	width: 56px;
	height: 56px;
	background: url(common/img/common/arw_circle_right.svg) no-repeat center / contain;
	transform: translateY(-50%);
}
@media screen and (max-width:768px) {
	.contact_link::after {
		right:0;
	}
}
.contact_link:first-child {
	padding-left: 0;
	border: none;
}
.contact_link__ttl {
	margin-bottom: 20px;
	font-size: 2.0rem;
	font-weight: 500;
}
.contact_link__ttl_dbl{
	margin:0 0 35px;
	line-height:1;
    font-size: 5rem;
    font-weight: 700;
	font-family: "Outfit", sans-serif;
}
.contact_link__ttl_dbl span{
    font-size: 2.0rem;
    font-weight: 500;
    font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", sans-serif;
    padding-left: 12px;
}

@media screen and (max-width: 768px) {
	.contact {
		padding: 34px 0;
	}
	.contact_link {
		width: 100%;
		padding: 24px 0;
		border-left: none;
		border-top: solid 1px #B3B3B3;
	}
	.contact_link::after {
		width: 48px;
		height: 48px;
	}
	.contact_link__ttl {
		margin-bottom: 10px;
		font-size: 1.8rem;
	}
	.contact_link:first-child::after {
		right: 0;
	}
	.contact_link__ttl_dbl{
		font-size:2.4rem;
	}
	.contact_link__ttl_dbl span{
		display: block;
		padding:10px 0 0;
		font-size:1.7rem;
	}
}


/* footer
---------------------------------------------------------- */
.footer {
	padding: 40px 0;
	margin-top: 2px;
	background: url(common/img/common/bg_contact.jpg) no-repeat center / cover;
}
.footer_content__txt {
	line-height: 2;
	color: #393939;
	font-size: 1.3rem;
}
.footer_nav {
	column-gap: 72px;
}
.footer_nav__lists {
	font-size: 1.4rem;
}
.footer_nav__list {
	margin-bottom: 20px;
	color: #393939;
}
.footer_subnav__lists {
	padding-left: 1em;
}
.footer_subnav__list {
	margin-top: 1em;
	color: #656565;
}
.f_cont{
	gap:10px;
}
.sns_lists {
	column-gap:20px;
}
.sns_list {
	height: 40px;
}

@media screen and (max-width: 768px) {
  .footer {
    padding: 20px 0;
  }
  .footer_nav {
    gap: 20px 35px;
    margin-bottom: 40px;
  }
  .f_cont{
	gap:0;
}
}