@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
リセットCSS
************************************/
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
li,
dt,
dd,
p,
div,
span,
img,
a,
table,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  font-size: 16px;
}

header,
footer,
nav,
section,
article,
main,
aside,
figure,
figcaption {
  display: block;
}

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

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

a {
  color: inherit;
  text-decoration: none;
  font-weight: inherit;
  cursor: pointer;
	transition:all 0.4s ease;
}

a:hover {
  color: inherit;
}
section{
	padding:3% 0%;
}
.fade-in {
  opacity: 0;
  transition: opacity 2s ease;
}

.fade-in.show {
  opacity: 1;
}

.fade-in.delay {
  transition-delay: 0.5s;
}

.fade-up {
  opacity: 0;
  transform: translateY(8%);
  transition: opacity 1s ease, transform 1s ease;
}

.fade-up.show {
  opacity: 1;
  transform: translateY(0);
}
/* 右から現れる */
.fade-right {
  opacity: 0;
  transform: translateX(10%);
  transition: opacity 1s ease, transform 1s ease;
}

.fade-right.show {
  opacity: 1;
  transform: translateX(0);
}

/* 左から現れる */
.fade-left {
  opacity: 0;
  transform: translateX(-10%);
  transition: opacity 1s ease, transform 1s ease;
}

.fade-left.show {
  opacity: 1;
  transform: translateX(0);
}
/* 汎用コンテナ */
.stagger-fade-up > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.stagger-fade-up > *.show {
  opacity: 1;
  transform: translateY(0);
}
.fade-up-delay {
  opacity: 0;
  transform: translateY(8%);
  transition: opacity 1s ease, transform 1s ease;
}

.fade-up-delay.show {
  opacity: 1;
  transform: translateY(0);
}

/************************************
共通設定
************************************/
html {
  scroll-behavior: smooth;
}

body {
	font-family: 'Noto Serif', serif;
  font-size: 1rem;
  letter-spacing: 0.1rem;
  background-color: rgba(255, 255, 255, 1);
  color: #424242;
	position:relative;
	
}
.is-pad{
	display:none;
}
.is-sp{
	display:none;
}
.is-pc{
	display:block;
}
.btn {
	display: inline-flex;
    align-items: center;
    justify-content: center;
	padding:2% 0%;
	font-size: 1.2rem;
	font-weight: bold;
    border-radius: 5px;
    color: #fff;
    text-align: center;
	transition: all 0.2s;
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.25);
	border: none;
	cursor: pointer;
	position: relative;
	top: 0;
	left: 0;
	letter-spacing: 0.05em;
	height:6vh;
	background: linear-gradient(to right, #1976D2, #73B1EE);

}
.btn:hover {
	box-shadow: none;
	top: 2px;
	left: 2px;
	opacity: 1;
/* 	background: linear-gradient(to right, #FFCA57, #FFD28B); */
}
/* メールボタン用スタイル - 既存 */
.btn-mail {
}
.btn i {
	color: #fff;
    margin-right: 2%;
    transition: all 0.4s;
    display: inline-block;
    transform: scale(1, 0.806); /* 高さを約80.6%に縮小（29÷36=0.806） */
    transform-origin: center; /* 変形の基準点を中央に */
}
.orange-accent{
	font-size:5rem;
	font-weight:bold;
	color:#FF8A00;
	margin-right:1%;
}

.black-bold-accent{
	font-weight:bold;
	font-size:1.2rem;
}
.section-title{
	width:25%;
	margin:0 auto;
	display:flex;
	justify-content:center;
	align-items:center;
}
.section-title img{
	width:25%;
}
.section-title-text{
	width:60%;
	display:flex;
	flex-direction:column;
}
.section-title-main{
	font-size:2rem;
	font-weight:bold;
	text-align:center;
}
.section-title-main-border{
	height:1px;
	border-radius:5px;
	background-color:#1976D2;
	
}
.section-title-sub{
	color:#1976D2;
	text-align:center;
	font-size:1rem;
}
section{
	display:flex;
	flex-direction:column;
}
.section-container{
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
	margin-top:3% !important;
}
.section-container img{
	width:50%;
	border-radius:10px;
	filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.3));
	object-fit:contain;
}
.page-container .section-container img{
	margin-top:0%;
}
.section-text{
	display:flex;
	flex-direction:column;
	width:45%;
	font-size:1rem;
}
.section-sub-title{
	font-size:1.2rem;
	font-weight:bold;
	color:#1976D2;
}
.section-text-button{
	background: linear-gradient(to right, #D4AF37, #FFEAA4);
	color:white;
	width:40%;
	margin-top:3%;
}
.section-text-button:hover{
	color:white;
}
.section-message{
	font-size:1.5rem;
	color:#1976D2;
	text-align:center;
	margin-top:3%;
	font-weight:bold;
}
.section-container.reverse{
	flex-direction:row-reverse;
}
body {
  margin: 0;
	
}
.header-sp-pad-icon{
	display:none;
}
.black-background{
	display:none;
}
.wrapper{
	width:90%;
	max-width:1200px;
	margin:0 auto;
}
/************************************
ローディング
************************************/
/* ローディング全体 */
.loader {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  overflow: hidden;
	background-color:white;
}
.loader img{
	width:10%;
	margin:0 auto;
	opacity: 0; /* 最初は非表示 */
  animation: fade-in-logo 0.8s ease forwards;
  animation-delay: 0.2s; /* 0.2秒後に出現 */
}
@keyframes fade-in-logo {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}
/* 背景 */
.bg {
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  z-index: 1;
}
.bg.blue {
  background: #1976D2;
  animation: slide-in-blue 1s ease forwards;
  animation-delay: 1s;
}

/* 緑背景 */
@keyframes slide-in-blue {
  from { left: -100%; }
  to   { left: 0; }
}
.grecaptcha-badge{
	display:none;
}
/************************************
ヘッダー
************************************/
header{
	position:fixed;
	top:5%;
	width:90%;
	margin:0 auto;
	left: 50%;
  transform: translateX(-50%);
	z-index:99;
}
.header-wrapper{
	display:flex;
	justify-content:space-between;
}
.logo-wrapper{
	width:20%;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.logo-1{
	width:30%;
}
.logo-1 img {
	width:100%;
}
.header-title{
	width:65%;
	color:white;
	font-weight:bold;
	font-size:1.2rem;
}
.header-navi{
	border-radius:50px;
	background-color:rgba(255, 255, 255, 0.9);
	
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.25);
	display:flex;
	justify-content:space-between;
	padding:0.5% 2%;
	width:42%;
}
.menu{
	display:flex;
	justify-content:space-between;
	padding:0% 1%;
	width:52%;
	font-size:1rem;
	
}
.menu li{
	display:flex;
	justify-content:center;
	align-items:center;
	font-weight:bold;
}
.menu li a:hover{
	color:rgb(25, 118, 210);
}
.header-contact{
	width:40%;
}
.header-contact a{
	width:100%;
	border-radius:50px;
	font-size:1rem;
	font-weight:bold;
}
header.scrolled .header-title {
  color: #1976D2;
	transition:all 0.3s ease;
}
.sp-pad-header-button{
	display:none;
}
.fixed-header{
	display:none;
}
/************************************
メインビジュアル
************************************/
.mainvisual{
	background-image:url('http://adlibi-g.com/wp-content/uploads/2025/11/frank-mckenna-OD9EOzfSOh0-unsplash1-scaled.jpg');
	background-size:cover;
	width:100%;
	height:100vh;
	position:relative;
}
.mainvisual-main-text{
	position:absolute;
	bottom:20%;
	left:5%;
	color:white;
	font-size:5.5rem;
	letter-spacing:0.8rem;
	font-weight:bold;
	text-shadow: 4px 4px 4px rgba(0,0,0,0.5);
}
.mainvisual-sub-text{
	bottom:10%;
	left:5%;
	position:absolute;
	font-size:1.2rem;
	color:white;
	text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}
.mainvisual-main-text,
.mainvisual-sub-text {
	opacity: 0;
	transition: opacity 1.5s ease;
}

/* メインテキストは1秒後にフェードイン */
.mainvisual-main-text.show {
	opacity: 1;
	transition-delay: 2.8s;
}

/* サブテキストはさらに遅れて表示 */
.mainvisual-sub-text.show {
	opacity: 1;
	transition-delay: 3.3s;
}
/************************************
創業への想い
************************************/
.vision{
	position:relative;
}
.background-letter{
	position:absolute;
	left:-8%;
	font-weight:bold;
	font-size:12rem;
	top:5%;
	color:#B5DAFF;
	letter-spacing:1.5rem;
	writing-mode: vertical-rl;   /* 縦書き */
}
/************************************
事業内容
************************************/
.business{
	position:relative;	
}
.background-img.earth{
	position:absolute;
	right:0%;
	top:30%;
	width:20%;
}

.background-img.compass{
	position:absolute;
	left:0%;
	top:62%;
	width:27%;
}
.background-img img{
	width:100%;
}
.business-container{
	margin-top:3%;
	z-index:2;
}
.business-box{
	display:flex;
	justify-content:space-between;
	margin-bottom:3%;
}
.business-box img{
	width:48%;
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.25);
	border-radius:10px;
	height:45vh;
}
.business-text{
	width:48%;
	display:flex;
	flex-direction:column;
}
.business-title-number{
	display:flex;
	align-items:center;
}
.business-number{
	color:#D4AF37;
	font-size:5rem;
	margin-right:3%;
}
.business-title{
	color:#1976D2;
	font-weight:bold;
	font-size:1.2rem;
}
.business-box.reverse{
	flex-direction:row-reverse;
}
.business-description{
	font-size:1rem;
}
/************************************
人材紹介
************************************/
.persons{
	padding:3% 0%;
	background-image:url('https://adlibigroup.com/wp-content/uploads/2025/10/海外進出企業.png');
	background-attachment:fixed;
	background-size:cover;
}
.persons-container{
	display:flex;
	justify-content:space-between;
	margin-top:3%;
}
.persons-box{
	display:flex;
	flex-direction:column;
	background-color:white;
	width:30%;
	border-radius:10px;
	padding:1% 0%;
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.25);
}
.persons-box img{
	width:92%;
	margin:0 auto;
}
.persons-box-name{
	font-size:1.2rem;
	font-weight:bold;
	color:#1976D2;
	text-align:center;
	margin:3% 0%;
}
.persons-box-text{
	font-size:1rem;
	padding:0% 4%;
}
/************************************
会社概要
************************************/
.company-container{
	margin-top:3%;
	display:flex;
	justify-content:space-between;
}
.company-text{
	width:48%;
	font-size:1rem;
}
.company-map{
	width:48%;
}
table th{
	background-color:white;
}
table tr:nth-of-type(2n+1){
	background-color:white;
}
table:not(.has-border-color) :where(th, td){
	border:none;
}
table th,
table td{
	border-bottom: 1px solid lightgray !important;
}
/************************************
固定ページ_共通設定
************************************/
.page-mainvisual{
	width:100%;
	height:50vh;
	position:relative;
}
.page-mainvisual-text{
	font-size:3rem;
	color:white;
	font-weight:bold;
	position:absolute;
	left: 50%;
  transform: translateX(-50%);
	bottom:40%;
}
.page-container{
		
}
/************************************
お問い合わせページ
************************************/
.page-mainvisual.contact-page{
	background-image:url('http://adlibi-g.com/wp-content/uploads/2025/11/海外進出企業-2-scaled.png');
	background-size:cover;
	background-position:center;
}

.contact-page-form{
	width:80%;
	margin: 0 auto;
	color:#333;
	margin-bottom:5%;
	margin-top:5%;
	max-width:1200px;
}
.contact-page-form input {
	border:solid 1px #333 !important;
}
.contact-page-form select {
	border:solid 1px #333 !important;
}
.contact-page-form textarea {
	border:solid 1px #333 !important;
}
.must-area{
	color:white;
	padding:0.5% 3%;
	border-radius:5px;
	background-color:#d00;
	margin-left:3%;
	font-size:0.8rem;
}
.contact-title-area{
	width:30%;
	display:flex;
	align-items:center;
}
input::placeholder{
	color:lightgray;
}
select{
	color:#656565;
}
.contact-page-form .wpcf7-form label{
	display:flex;
	justify-content:space-between;
	margin:auto;
	font-size:1.3rem;
	margin-bottom: 3%;
}
.contact-form-box{
	display:flex;
	justify-content:space-between;
	margin:auto;
	font-size:1.3rem;
	margin-bottom: 3%;
	width:100%;
	align-items:flex-start;
}
.contact-form-box p{
	width:65%;
}
.must-box{
	background-color:#FF8B8B;
	border-radius:5px;
	color:white;
	font-weight:bold;
	width:40%;
	display:flex;
	justify-content:center;
	padding:2% 0%;
}
.must-box p{
	display:flex;
	justify-content:center;
	font-weight:bold;
}
.contact-title-area.text-area{
	align-items:flex-start;
}
.contact-page-form .wpcf7-form-control-wrap{
	width:65%;	
}
.contact-page-form .wpcf7-form-control.wpcf7-submit.has-spinner{
	width:30%;
	margin:auto;
	border-radius:10px;
	border:none !important;
	display: block;
	color:white;
	font-size:1.5rem;
	background: linear-gradient(to right, #D4AF37, #FFEAA4);
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
	transition: all 0.2s ease-in-out;
	font-family: 'Noto Serif', serif;
}
.contact-page-form .wpcf7-form-control.wpcf7-submit.has-spinner:hover{
	box-shadow: none;
    transform: translateY(2px);
	transform: translateX(2px);
}
/************************************
個人情報保護ページ
************************************/
.page-mainvisual.privacy-policy-page{
	background-image:url('https://adlibigroup.com/wp-content/uploads/2025/10/海外進出企業-3-1.png');
	background-size:cover;
	background-position:center;
}
.page-section-title{
	font-size:1.2rem;
	color:#1976D2;
	margin-top:2%;
}
.page-section{
	width:90%;
	margin:0 auto;
}
/************************************
フッター
************************************/
footer{
	 background: linear-gradient(to bottom, #ffffff, #B5DAFF);
}
.footer-logo{
	width:30%;
	margin:0 auto;
	display:flex;
	justify-content:center;
	font-size:1.2rem;
	color:#1976D2;
	align-items:center;
	font-weight:bold;
	margin-bottom:5%;
}
.footer-logo img{
	width:30%;
	margin-right:5%;
}
.footer__container{
	display:flex;
	flex-direction:column;
}
.footer-menu{
	width:40%;
	margin:0 auto;
	display:flex;
	justify-content:space-between;
}
.footer-menu a:hover{
	color:#1976D2;
}
.footer__copyrightWrap{
	text-align:center;
	margin-top:3%;
}
/************************************
iPad
************************************/
/*1023px以下*/
@media screen and (max-width: 1024px){
	.logo-wrapper{
		width:40%;
	}
	.header-navi{
		display:none;	
	}
	.is-pad{
		display:flex;
	}
	.is-pc{
		display:none;
	}
	.fixed-header{
		display:flex;
		width:35%;
		border-radius:50px;
	}
	.sp-pad-header-button{
		display:flex;
		width: 30%;
		padding:0.5% 0%;
	}
	.mainvisual-main-text{
		font-size:4rem;
		letter-spacing:0.5rem;
	}
	.mainvisual{
		height:70vh;
		background-position:center;
	}
	.section-container img{
		object-fit:cover;
		height:40vh;
		object-position:top;
	}
	.section-title{
		width:50%;
	}
	.section-container{
		flex-direction:column;
	}
	.section-container img{
		width:100%;
	}
	.section-text{
		width:100%;
		z-index:2;
		text-align:center;
		margin-top:3%;
	}
	.background-letter{
		font-size:12rem;
		left:-15%;
		text-align:center;
		margin-top:3%;
	}
	.section-text-button{
		margin:3% auto 0% auto;
	}
	.section-message{
		width:90%;
		margin:0 auto;
		font-size:1.3rem;
		margin-top:3%;
	}
	.business-box{
		flex-direction:column;
	}
	.business-box img{
		width:100%;
	}
	.business-text{
		width:100%;
	}
	.business-box.reverse{
		flex-direction:column;	
	}
	.business-box img{
		height:35vh;
		object-fit:cover;
	}
	.background-img.earth{
		top:22%;
		width:40%;
	}
	.background-img.compass{
		top:70%;
		width:50%;
	}
	.persons-container{
		flex-direction:column;
	}
	.persons-box{
		width:100%;
		margin-bottom:3%;
		padding:2%;
	}
	.persons-box img {
    	width: 100%;
    	object-position: top;
    	object-fit: cover;
		height: 40vh;
	}
	.company-container{
		flex-direction:column;
		
	}
	.company-text{
		width:100%;
	}
	.company-map{
		width:100%;
		margin-top:3%;
	}
	.company-map iframe{
		width:100%;
	}
	.fixed-footer {
		position:fixed;
		bottom:3%;
		display:flex;
		justify-content:space-between;
		z-index:5;
		width:85%;
		margin:0 auto;
		left: 50%;
		transform: translateX(-50%);
		transition: transform 0.3s ease;
	}
	.fixed-footer a{
		width:45%;
		background:white;
		border:2px solid #D4AF37;
		color:#D4AF37;
	}
	.fixed-footer a img{
		width:10%;
		margin-right:3%;
	}
	.fixed-footer.hide {
		transform: translate(-50%, 190%);
	}

	/* 表示状態 */
	.fixed-footer.show {
		transform: translate(-50%, 0); /* 中央を維持 */
	}
	.footer-logo{
		width:40%;
	}
	.footer-menu{
		width:70%;
	}
	.btn-company{
		
	}
	.contact-page-form{
		width:90%;
	}
	.contact-form-box{
		flex-direction:column;
	}
	.contact-form-box p{
		width:100%;
		margin-top:2%;
	}
	.contact-title-area{
		width:40%;
	}
	
	
}

/*834px以下*/
@media screen and (max-width: 599px){
  /*必要ならばここにコードを書く*/
	.is-pad{
		display:none;
	}
	.is-sp{
		display:flex;
	}
	.loader img{
		width:20%;
	}
	.header-title{
		font-size:0.8rem;
		color:#1976D2;
	}
	.btn{
		font-size:0.8rem;
	}
	.logo-wrapper{
		width:60%;
		justify-content:flex-start;
	}
	.logo-1{
		width:25%;
	}
	.fixed-header{
		display:flex;
		width:40%;
	}
	.mainvisual-main-text {
        font-size: 2rem;
        letter-spacing: 0.3rem;
		bottom:25%;
    }
	.mainvisual-sub-text{
		font-size:0.8rem;
		bottom:5%;
	}
	.section-title{
		width:70%;
	}
	.section-title-main{
		font-size:1.2rem;
	}
	.section-title-sub{
		font-size:1rem;
	}
	.section-title img{
		width:20%;
	}
	.background-letter{
		font-size:6rem;
		top:40%;
	}
	.section-sub-title{
		font-size:1rem;
	}
	.section-description{
		font-size:0.8rem;
	}
	.section-message{
		font-size:1rem;
	}
	.business-number{
		font-size:4rem;
	}
	.business-title{
		font-size:1rem;
	}
	.business-description{
		font-size:0.8rem;
	}
	.persons-box-text{
		font-size:0.8rem;
	}
	.persons-box-name{
		font-size:1rem;
	}
	.company-text{
		font-size:0.8rem;
	}
	.footer-logo{
		font-size:1rem;
		width:60%;
	}
	.footer-menu {
        width: 90%;
        font-size: 0.8rem;
    }
	.page-mainvisual-text{
		font-size:1.5rem;
		width:90%;
		text-align:center;
	}
	.page-section{
		font-size:0.8rem;
	}
	.page-section-title{
		font-size:1rem;
	}
	.contact-form-box{
		font-size:1rem;
	}
	.contact-title-area{
		width:65%;
	}
	.contact-page-form .wpcf7-form-control.wpcf7-submit.has-spinner{
		width:50%;
		font-size:1rem;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}