@charset "UTF-8";
/*Theme Name:Area development lab.
Author:Antenna
Description:This is the theme of Antenna
Version:2025.04
*/

		@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Noto+Sans+JP:wght@100..900&display=swap');
		
		@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text:ital@0;1&display=swap');

html{background-color: #b1b2b7;}

body, html {
	margin: 0;
	padding: 0;
	font-size:16px;
	width: 100%;
	height: 100%;
	font-family: 'Noto Sans JP', sans-serif;
	font-style: normal;
	line-height: 180%;
	color: #fff;
	letter-spacing: 0.03em;
	scroll-behavior: smooth;
	font-weight: 300;
}

#wrapper {background-color: #878fb2; max-width: 900px; margin:0 auto;}

ul{list-style-type: none; padding: 0;}
a{color: #fff; text-decoration: underline; text-decoration-thickness: 1px;}
a:hover{opacity: .7;}

header {background-image: url("images/top.jpg"); background-size: cover; background-position:center;}
.header_inn{width: 90%; margin:0 auto; padding:60px 0 100px 0; max-width: 660px;}
.header{width:40%; max-width: 220px;}
.introduction{margin:60px 0;}
.introduction h1{font-size:1.2em; font-weight: 400;}
.intro-text {margin-top:25px;}

#main-visual {display: flex; flex-wrap: wrap;}
#main-visual img{width: 50%;}

main{width: 90%; margin:0 auto; max-width: 900px;}
h2{font-size:1.25em; margin-bottom:5px; font-weight: 600;}
#director{padding:60px 0 30px 0;}
.fst {margin-top:20px !important;}
.profile{display: flex; flex-direction: column; margin:40px 0;}
.prf-img{width: 36%; margin:20px auto; max-width: 280px;}
.profile img{width: 100%; height: auto; display: block;}
.profile h3{font-size: 1.1em; margin:0; font-weight: 400;}
.profile p{margin-top:5px;}
.profile-link {margin-top:30px;}

#facilitator,#supervision{margin-bottom: 40px;}
#facilitator h3,#supervision h3{font-size: 1.1em; margin:0; font-weight: 400;}

#contact a{text-decoration: none; font-weight: bold; width: 80%; max-width: 320px;}
#contact {display: flex; justify-content: center; margin:100px 0;}
.contact-btn {border:1px solid #fff; padding:5px; text-align: center;}

footer{font-size: 0.9em; text-align: center; padding-bottom: 20px; font-family: "DM Serif Text", serif; font-weight: 400; font-style: normal;}


@media (min-width: 768px){
	header {background-position:center;}
	#main-visual img{width: 25%;}
	#main-visual {flex-wrap: nowrap;}
	
	.profile {flex-direction:initial; vertical-align: top; justify-content: space-between;}
	.prf-img {width:25%; margin: 0;}
	.profile img {margin:0;}
	.profile-text {width: 70%;}
}