@charset "UTF-8";

/*
======== table of content. ===============
summary:ページ要素（PC）
====================================
*/

/* コンテンツ */
#content { line-height: 180%; }
/*en*/
.en #content { line-height: 150%; }

/* メインビジュアル */
#mv { margin-bottom: -1.5vw; }

#mv h1 { margin-top: -15vw; font-family: 'Sawarabi Mincho', sans-serif; letter-spacing: 0.4em; text-align: right; }
/*en*/
.en #mv h1 { letter-spacing: 0.2em; }
#mv h1 span { display: inline-block; margin-bottom: 2vw; padding: .2em 2em .2em 1em; background: #000; color:#fff; font-size: 3.8vw; }
#mv h1 span:last-child { margin-bottom: 0; }

/* イントロ */
.txt_intro { display: flex; justify-content: center; align-items: center; padding:6.4% 16%; background: #e0a81b; color:#fff; line-height: 200%; text-align: center; }
.en .txt_intro { padding: 6.4% 10%; }

.txt_intro p { font-size: 1.4vw; font-weight: 700; }

/* コンテンツ */
.content_inner { padding-left: 6.4%; padding-right: 6.4%; }
.home .content_inner { padding-top: 6.2%; padding-bottom: 5.3%; }

/* 東京栄養サミット2020開催 */
.sec_summit { background: #3a88a7; color:#fff; }

.sec_summit h2 { color: #fff; }
.sec_summit .img_sm { margin-left: 9%; margin-right: 9%; }

/* パリ栄養サミット2025開催 */
.sec_summit2025 { background: #F2F2F2; color:#000; }

.sec_summit2025 .img_sm { max-width: 500px;width: 40%;margin: 0 auto 60px;}

.sec_summit2025 h2 { color: #000; }

.paris_inner { width: 80%; margin: 0 auto; }
.paris_inner p,.paris_inner a { text-align: left; }

/* 関連資料・リンク */
.sec_link { }
.sec_link h2 {  }


/* /tokyosummit2020/ */
.sec_poster figure { padding: 0 18%; border-bottom: 4px solid #f7f7f7; text-align: center; }

.sec_detail h3 { position: relative; margin-bottom: 3.27%; padding-bottom:1.5rem; color: #0d496d; font-size: 2rem; text-align: center; }
.sec_detail h3::after { content: ""; display: block; position: absolute; bottom: 0; left: 0; right: 0; width: 5rem; height: 2px; margin: 0 auto; background-color: #0d496d;  }
.sec_detail p { margin-bottom: 5.3%; }


/* /en/policy/ */
.sec_policies h3 { padding-bottom: 1rem; border-bottom: 2px solid #e5e6e6;  font-size: 2rem; }
.sec_policies div { text-align: left; }
.sec_policies .box_basemake { margin-bottom: 6.2%; }
.sec_policies dl { position: relative; border-bottom: 2px solid #e5e6e6; }
.sec_policies dt { padding: 2rem 0; font-size: 2rem; z-index: 1; cursor: pointer; }
.sec_policies dd { display: none; padding-bottom: 5rem; }
.sec_policies dd h4 { margin-bottom: 1rem; color: #f29300; }
.sec_policies .btn_close { position: relative; margin-top: 1rem; }


.sec_policies dt::before,
.sec_policies .btn_close::before { content: ""; position: absolute; right: 0.5em; top: 2.8rem; width: 0.6rem; height: 0.6rem; border-bottom: 2px solid #fff; border-right: 2px solid #fff; z-index: 3; transform: rotate(45deg); transition: top .7s cubic-bezier(0.230, 1.000, 0.320, 1.000), transform .7s cubic-bezier(0.230, 1.000, 0.320, 1.000);  }
.sec_policies dt::after,
.sec_policies .btn_close::after { content: "DETAILS"; position: absolute; right: 0; top: 2rem; display: inline-block; width: 5em; padding: 0.1em 1.5em 0.1em 0.5em; background-color: #1b70af; color: #fff; font-size: 1.2rem; text-align: center; z-index: 2; transition: opacity .7s cubic-bezier(0.230, 1.000, 0.320, 1.000); }
.sec_policies dt.on::before { top: 3.1rem; transform: rotate(-135deg); }
.sec_policies dt.on::after { content: "HIDE"; }
.sec_policies .btn_close::before { top:1.1rem; transform: rotate(-135deg); }
.sec_policies .btn_close::after { content: "HIDE"; top:0; cursor: pointer;  }
.sec_policies dt:hover::after,
.sec_policies .btn_close:hover::after { opacity: 0.8; }