@charset "UTF-8";

/*!
Theme Name: Cocoon Child for IETDSO
Description: IETDSO向けCocoon子テーマ（改変用）
Theme URI: https://ja.ietdso.com/
Author: 一般社団法人 国際エネルギー＆テクノロジー開発支援機構
Author URI: https://ja.ietdso.com/
Template: cocoon-master
Version: 1.0.0
*/

/* =========================================================
   IETDSO Child Theme CSS
   ---------------------------------------------------------
   方針:
   - 元CSSの見た目・機能を維持
   - 後半に追加されていたオーバーライドを統合
   - Cocoon由来のCSSに負けやすい箇所のみ !important を残す
   - ブレークポイント:
     PC/Tablet : 835px以上
     PC        : 1168px以上
     Tablet    : 835px〜1167px
     Mobile    : 834px以下
     Small     : 480px以下
========================================================= */

/* =========================================================
   1. Variables / 共通変数
========================================================= */

:root{
	--ietdso-accent:var(--cocoon-pink-color, #e95295);
	--ietdso-accent-soft:#fff0f7;
	--ietdso-accent-border:#ffd6ea;
	--ietdso-text:var(--cocoon-text-color, #333);
	--ietdso-muted:var(--cocoon-pallid-text-color, #777);
	--ietdso-border:var(--cocoon-thin-color, #ddd);
	--ietdso-bg:var(--cocoon-white-color, #fff);
	--ietdso-bg-soft:var(--cocoon-xxx-thin-color, #fafbfc);
	--ietdso-side-bg:var(--cocoon-xx-thin-color, #f5f6f7);
	--ietdso-radius:var(--cocoon-middle-border-radius, 8px);
	--ietdso-slider-caption-bg:linear-gradient(
		135deg,
		rgba(8,35,79,0.96) 0%,
		rgba(11,47,107,0.96) 55%,
		rgba(30,84,170,0.96) 100%
	);


	/* グローバルメニュー用。後で変更しやすいように分離 */
	--ietdso-menu-text:#0b2f6b;
	--ietdso-menu-border:#d18a00;

	/* モバイル・ヒーロー用。主要色はここでまとめて変更する */
	--ietdso-deep-purple:#1b2436;
	--ietdso-mobile-menu-bg:var(--ietdso-deep-purple);
	--ietdso-mobile-menu-border:#fff;

	/* モバイルヘッダー用 */
	--ietdso-mobile-logo-size:64px;
	--ietdso-mobile-header-gap:82px;
	--ietdso-mobile-header-title-gap:1em;
	--ietdso-mobile-header-height:80px;

	/* 新規追加 */
	--ietdso-header-bg:linear-gradient(
		135deg,
	rgba(11,47,107,0.95) 0%,
	rgba(20,68,145,0.95) 100%
	);

}

/* =========================================================
   2. Base / 基本
========================================================= */

.entry-content{
	color:var(--ietdso-text);
}

.entry-content a{
	color:inherit;
}

.ietdso-section{
	margin:4em 0;
}

.ietdso-section-title{
	position:relative;
	display:block;
	font-size:2rem;
	font-weight:800;
	letter-spacing:0.06em;
	line-height:1.35;
	margin:0 0 1.6em;
	padding:0.85em 1.2em 0.85em 1.4em;
	color:#fff;
	background:linear-gradient(90deg, var(--ietdso-accent) 0%, #ffb6d9 100%);
	border:none;
	border-radius:18px;
	box-shadow:0 10px 26px rgba(233,82,149,0.22);
}

.ietdso-section-title::before{
	content:attr(data-en);
	display:block;
	font-size:0.72rem;
	font-weight:700;
	letter-spacing:0.18em;
	color:#fff;
	opacity:0.9;
	margin-bottom:0.3em;
}

.ietdso-section-title::after{
	content:"";
	position:absolute;
	right:1.2em;
	top:50%;
	width:90px;
	height:2px;
	background:#fff;
	opacity:0.75;
}

.ietdso-section-lead{
	font-size:1.05em;
	line-height:1.8;
	margin-bottom:1.8em;
}

.ietdso-section-body{
	line-height:1.9;
}

/* =========================================================
   3. Header / ヘッダー
========================================================= */

.logo.logo-header.logo-image + .ietdso-header-title{
	margin-left:2em !important;
}

.ietdso-header-title{
	margin-left:2em;
	display:flex;
	flex-direction:column;
	justify-content:center;
	text-decoration:none;
	color:var(--ietdso-text);
	line-height:1.2;
}

.ietdso-header-title:hover{
	opacity:0.85;
}

.ietdso-header-title-small{
	font-size:0.72rem;
	font-weight:700;
	letter-spacing:0.06em;
}

.ietdso-header-title-main{
	font-size:1rem;
	font-weight:800;
	line-height:1.2;
}

/* ヘッダロゴ画像の消失防止 */
#header .logo,
#header-in .logo,
.logo.logo-header.logo-image,
.site-name,
.site-name-text,
.site-name-text-link{
	display:block !important;
	visibility:visible !important;
	opacity:1 !important;
}

#header .logo img,
#header-in .logo img,
.logo-header .site-logo-image,
.site-name-text .site-logo-image{
	display:block !important;
	visibility:visible !important;
	opacity:1 !important;
	height:auto;
	max-width:100%;
}

/* =========================================================
   4. PC / Tablet Global Menu
   ---------------------------------------------------------
   後半オーバーライドの最終形をここに統合。
   白背景、紺文字、金系ボーダー、角丸6px。
========================================================= */



/* =========================================================
   5. Contact Form 7
========================================================= */

.wpcf7{
	max-width:900px;
	margin:0 auto;
}

.wpcf7 label{
	display:block;
	margin-bottom:1.5em;
	font-weight:bold;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 select,
.wpcf7 textarea{
	width:100%;
	padding:0.8em;
	margin-top:0.5em;
	border:1px solid var(--cocoon-basic-border-color, #ccc);
	border-radius:var(--cocoon-middle-border-radius, 8px);
	box-sizing:border-box;
	font-size:1rem;
}

.wpcf7 textarea{
	min-height:180px;
}

.wpcf7-submit{
	background:var(--ietdso-accent);
	color:#fff;
	border:none;
	padding:1em 3em;
	border-radius:999px;
	cursor:pointer;
	font-size:1rem;
	transition:opacity 0.2s ease;
}

.wpcf7-submit:hover{
	opacity:0.82;
}

/* =========================================================
   6. Hero Slider
========================================================= */

.ietdso-hero-section{
	width:100vw;
	max-width:100vw;
	margin:0 calc(50% - 50vw) 4em;
}

.ietdso-slider-top{
	width:100%;
	margin:0;
	background:var(--ietdso-bg-soft);
}

.ietdso-slider-top .swiper-slide{
	position:relative;
	height:clamp(420px, 58vw, 780px);
	overflow:hidden;
}

.ietdso-slide-picture,
.ietdso-slide-picture picture{
	display:block;
	width:100%;
	height:100%;
}

.ietdso-slide-picture img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.ietdso-slider-top .swiper-pagination-bullet-active{
	background:var(--ietdso-accent);
}

.ietdso-slider-top .swiper-button-prev,
.ietdso-slider-top .swiper-button-next{
	color:#fff;
	text-shadow:0 2px 8px rgba(0,0,0,0.35);
}
.ietdso-slide-caption{
	position:absolute;
	left:7%;
	bottom:10%;
	z-index:20;
	width:min(640px, 78vw);
	padding:2em 2.2em;

	background:var(--ietdso-slider-caption-bg);

	backdrop-filter:blur(10px);
	border:1px solid rgba(255,255,255,0.12);
	border-radius:24px;
	box-shadow:0 14px 42px rgba(0,0,0,0.42);
	color:#fff;
}

.ietdso-slide-title{
	/* font-size: clamp(1.9rem, 2.9vw, 3.1rem); */
	font-size:clamp(1.52rem, 2.42vw, 2.65rem);
	font-weight:800;
	line-height:1.25;
	/* letter-spacing:0.03em; */
	color:#fff;
	text-shadow:0 2px 12px rgba(0,0,0,0.45);
}

.ietdso-slide-subtitle{
	margin-top:1em;
	font-size:1rem;
	line-height:1.9;
	color:rgba(255,255,255,0.92);
}

.ietdso-image-row{
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:18px;
	max-width:960px;
	margin:1.5em auto;
}

.ietdso-image-row-item{
	margin:0;
	background:var(--ietdso-bg-soft);
	overflow:hidden;
}

.ietdso-image-row-item img{
	display:block;
	width:100%;
	aspect-ratio:4 / 3;
	height:auto;
	object-fit:cover;
}

/* =========================================================
   7. Business + News Layout
========================================================= */

.ietdso-business-news-layout{
	display:grid;
	grid-template-columns:minmax(0, 1fr) 320px;
	gap:56px;
	align-items:start;
}

.ietdso-business-main-area{
	min-width:0;
}

.ietdso-business-card-grid{
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:20px;
	padding:24px;
	border-radius:24px;
	background:var(--ietdso-accent-soft);
	border:1px solid var(--ietdso-accent-border);
}

.ietdso-business-side-area{
	display:flex;
	flex-direction:column;
	gap:28px;
}

.ietdso-side-section-title{
	font-size:1.3rem;
	font-weight:800;
	margin:0 0 1em;
	padding-bottom:0.5em;
	border-bottom:3px solid var(--ietdso-accent);
}

.ietdso-business-card{
	height:100%;
	min-height:215px;
	display:flex;
	flex-direction:column;
	background:var(--ietdso-bg);
	border:1px solid var(--ietdso-border);
	border-radius:18px;
	overflow:hidden;
	text-decoration:none;
	color:var(--ietdso-text);
	box-shadow:0 8px 24px rgba(0,0,0,0.07);
	transition:transform 0.25s ease, box-shadow 0.25s ease, color 0.25s ease;
}

.ietdso-business-card:hover{
	transform:translateY(-4px);
	box-shadow:0 14px 32px rgba(0,0,0,0.12);
	color:var(--ietdso-accent);
}

.ietdso-business-img{
	height:135px;
	overflow:hidden;
	background:var(--ietdso-bg-soft);
}

.ietdso-business-img img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform 0.35s ease;
}

.ietdso-business-card:hover .ietdso-business-img img{
	transform:scale(1.04);
}

.ietdso-business-title{
	flex:1;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:1.05em;
	font-weight:700;
	line-height:1.5;
	padding:1em;
	text-align:center;
}

/* =========================================================
   8. Side Panel / 最新情報・活動実績サイド表示
========================================================= */

.ietdso-side-latest-panel{
	background:var(--ietdso-bg);
	border:1px solid var(--ietdso-border);
	border-radius:18px;
	overflow:hidden;
	box-shadow:0 8px 24px rgba(0,0,0,0.08);
}

.ietdso-side-latest-panel .ietdso-posts{
	margin:0 !important;
}

.ietdso-side-latest-panel .ietdso-ogp-grid{
	display:block !important;
	margin:0 !important;
}

.ietdso-side-latest-panel .ietdso-ogp-card{
	max-width:none !important;
	width:100% !important;
	border:none;
	border-radius:0;
	box-shadow:none;
	margin:0 !important;
}

.ietdso-side-latest-panel .ietdso-ogp-card:hover{
	transform:none;
	box-shadow:none;
}

/* =========================================================
   9. Posts / OGP Cards
========================================================= */

.ietdso-posts{
	margin:3.5em 0;
}

.ietdso-posts-title{
	font-size:1.65em;
	font-weight:700;
	letter-spacing:0.04em;
	margin:0 0 1.2em;
	padding-left:0.8em;
	border-left:6px solid var(--ietdso-accent);
}

.ietdso-ogp-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
	gap:24px;
}

.ietdso-ogp-card{
	display:block;
	text-decoration:none;
	color:inherit;
	background:var(--ietdso-bg);
	border:1px solid var(--ietdso-border);
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 8px 24px rgba(0,0,0,0.08);
	transition:transform 0.25s ease, box-shadow 0.25s ease;
}

.ietdso-ogp-card:hover{
	transform:translateY(-4px);
	box-shadow:0 12px 30px rgba(0,0,0,0.12);
}

.ietdso-ogp-thumb{
	background:var(--ietdso-bg-soft);
	overflow:hidden;
}

.ietdso-ogp-thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.ietdso-ogp-body{
	padding:1.1em 1.2em 1.3em;
}

.ietdso-ogp-date{
	font-size:0.9em;
	color:var(--ietdso-muted);
}

.ietdso-ogp-title{
	font-size:1.08em;
	font-weight:700;
	line-height:1.55;
	margin-top:0.35em;
}

/* =========================================================
   10. Adviser / Person Cards
========================================================= */

.ietdso-person-grid{
	display:grid;
	gap:24px;
}

.ietdso-person-grid-2{
	grid-template-columns:repeat(2, minmax(0, 1fr));
}

.ietdso-person-card{
	background:var(--ietdso-bg);
	border:1px solid var(--ietdso-border);
	border-radius:18px;
	padding:1.4em;
	text-align:center;
	box-shadow:0 8px 24px rgba(0,0,0,0.07);
}

.ietdso-person-photo{
	width:100%;
	max-width:240px;
	max-height:240px;
	margin:0 auto 1em;
	background:var(--ietdso-bg-soft);
	border-radius:14px;
	overflow:hidden;
}

.ietdso-person-photo img{
	width:100%;
	height:auto;
	max-width:240px;
	max-height:240px;
	object-fit:contain;
	display:block;
	margin:0 auto;
}

.ietdso-person-en{
	font-size:0.85em;
	color:var(--ietdso-muted);
}

.ietdso-person-name{
	font-size:1.25em;
	font-weight:700;
	margin-top:0.4em;
}

.ietdso-person-title,
.ietdso-person-profile{
	font-size:0.95em;
	color:#555;
	margin-top:0.5em;
	line-height:1.6;
}

/* =========================================================
   11. Adviser Slider
========================================================= */

.ietdso-slider-adviser{
	width:100%;
	margin:2em auto 3.5em;
	padding:0 0 3em;
}

.ietdso-adviser-card{
	background:var(--ietdso-bg);
	border:1px solid var(--ietdso-border);
	border-radius:16px;
	padding:1.5em;
	text-align:center;
	box-shadow:0 8px 24px rgba(0,0,0,0.07);
	min-height:320px;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;
}

.ietdso-adviser-card img{
	width:180px;
	height:180px;
	object-fit:cover;
	border-radius:0;
	display:block;
	margin:0 auto 1em;
	background:var(--ietdso-bg-soft);
}

/* =========================================================
   12. PC Inline Advisers
========================================================= */

.ietdso-business-inline-advisers{
	display:none;
}

.ietdso-inline-adviser-photo{
	flex:0 0 120px;
	max-width:240px;
	max-height:240px;
	background:var(--ietdso-bg-soft);
	border-radius:14px;
	overflow:hidden;
}

.ietdso-inline-adviser-photo img{
	width:100%;
	height:auto;
	max-width:240px;
	max-height:240px;
	object-fit:contain;
	display:block;
}

/* =========================================================
   13. Contact Section
========================================================= */

.ietdso-contact-section{
	text-align:center;
	background:var(--ietdso-accent-soft);
	border-radius:24px;
	padding:3em 2em;
}

.ietdso-contact-button-wrap{
	margin-top:2em;
	display:flex;
	align-items:center;
	justify-content:center;
}

.ietdso-contact-button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:56px;
	background:var(--ietdso-accent);
	color:#fff !important;
	text-decoration:none;
	font-weight:700;
	line-height:1.4;
	padding:0.9em 2.4em;
	border-radius:999px;
	box-shadow:0 8px 20px rgba(233,82,149,0.35);
	transition:opacity 0.2s ease, transform 0.2s ease;
}

.ietdso-contact-button:hover{
	opacity:0.86;
	transform:translateY(-2px);
}

/* =========================================================
   14. PC / Tablet Common
========================================================= */



/* =========================================================
   15. PC Layout: 1168px以上
========================================================= */



/* =========================================================
   16. Tablet Layout: 835px〜1167px
========================================================= */



/* =========================================================
   17. Mobile Layout: 834px以下
   ---------------------------------------------------------
   後半オーバーライドを統合した最終形。
   目的:
   - Cocoonの上段黒バーを実質消す
   - 白背景ヘッダー1行に [LOGO][機構名][MENU] を配置
   - MENUボタンは右端に重ねる
========================================================= */



/* =========================================================
   18. Small Mobile: 480px以下
========================================================= */


/* =========================================================
   Loading Screen Safety / ロード画面保護
   ---------------------------------------------------------
   モバイルヘッダーやCocoon余白調整の影響を受けないよう、
   ロード画面の子要素は通常のボックスとして描画する。
========================================================= */

.ietdso-loading,
.ietdso-loading *{
	box-sizing:border-box;
}

.ietdso-loading{
	margin:0 !important;
	padding:0 !important;
}

.ietdso-loading img{
	max-width:none;
}

/* =========================================================
   Loading Screen
========================================================= */

.ietdso-loading{
	position:fixed;
	inset:0;
	z-index:9999999;

	display:flex;
	align-items:center;
	justify-content:center;

	width:100vw;
	height:100vh;

	background:var(--ietdso-bg, #fff);

	opacity:1;
	visibility:visible;

	transition:
		opacity 0.7s ease,
		visibility 0.7s ease;
}

.ietdso-loading.is-hidden{
	opacity:0;
	visibility:hidden;
	pointer-events:none;
}

.ietdso-loading-inner{
	width:min(420px, 82vw);
	text-align:center;
	margin:0 auto;
	padding:2em;
	box-sizing:border-box;
}

.ietdso-loading-logo{
	width:120px;
	height:auto;
	display:block;
	margin:0 auto 1.2em;
}

.ietdso-loading-title{
	font-size:1.6rem;
	font-weight:700;
	letter-spacing:0.16em;
	margin:0 0 1em;
	color:var(--ietdso-text, #333);
}

.ietdso-loading-percent{
	font-size:1.1rem;
	font-weight:700;
	color:#555;
	margin:0 0 0.8em;
}

.ietdso-loading-bar{
	width:100%;
	height:8px;
	background:var(--ietdso-bg-soft, #f5f6f7);
	border-radius:999px;
	overflow:hidden;
}

.ietdso-loading-bar-fill{
	width:0%;
	height:100%;
	background:var(--ietdso-accent, #e95295);
	border-radius:999px;
	transition:width 0.12s ease;
}
/* =========================================================
   Tablet: ハンバーガーメニュー非表示
========================================================= */



input.wpcf7-form-control{
	border:solid black 1px;
}

/* =========================================================
   Inline Adviser
========================================================= */



/* =========================================================
   Tablet
========================================================= */



/* =========================================================
   Mobile
========================================================= */



/* =========================================================
   Smartphone Greeting
========================================================= */

.ietdso-sp-greeting{
	display:none;
}



.ietdso-side-more-link-wrap {
  margin-top: 1.2em;
  text-align: center;
}

.ietdso-side-more-link {
  display: inline-block;
  padding: 0.65em 1.4em;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-weight: 700;
  text-decoration: none;
}

/* Contact Form 7 送信ボタン */
.wpcf7 form .wpcf7-submit {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  width: auto !important;
  min-width: 240px;

  margin: 32px auto 0 !important;
  padding: 1em 3em !important;

  /* IETDSO系 紺黒 */
  background: linear-gradient(
    135deg,
    #1b2436 0%,
    #24324a 100%
  ) !important;

  color: #fff !important;

  border: 1px solid #2f415f !important;
  border-radius: 999px !important;

  font-size: 1rem !important;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.4;

  cursor: pointer;

  box-shadow:
    0 6px 16px rgba(0,0,0,0.20),
    inset 0 1px 0 rgba(255,255,255,0.08);

  transition:
    background-color 0.2s ease,
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

/* hover */
.wpcf7 form .wpcf7-submit:hover {
  background: linear-gradient(
    135deg,
    #24324a 0%,
    #314564 100%
  ) !important;

  color: #fff !important;

  transform: translateY(-2px);

  box-shadow:
    0 10px 24px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.12);

  opacity: 1 !important;
}

/* 押下時 */
.wpcf7 form .wpcf7-submit:active {
  transform: translateY(0);
}

/* スマホ */
#ietdso-header-menu-main{
	display:flex !important;
}

#ietdso-header-menu-sp{
	display:none !important;
}

@media screen and (max-width:839px){
	#ietdso-header-menu-main{
		display:none !important;
	}

	#ietdso-header-menu-sp{
		display:flex !important;
	}
}

/* カテゴリーラベルを非表示 */
.cat-label {
	display: none !important;
}