@charset "utf-8";

body {
  font-size: clamp(14px, 2.2vw, 18px);
}


body{
	margin:0;
	padding:0;
	background-image:url('images/01033673.JPG');
	background-size:cover;
	background-position:center;
	background-attachment:fixed;
	background-repeat:no-repeat;
	font-size:clamp(14px,2.2vw,18px;)
	font-family:'arial',sans-serif;
}

header{
	text-align:center;
	width:95%;
	margin:0 auto 20px;
}

h1{
	text-align:center;
	padding:20px 0px 16px;
}

header nav ul{
	display:flex;
	justify-content:center;
	list-style-type:none;
	border-top:2px solid #356cac;
	border-bottom:2px solid #356cac; 
	background-color:rgba(255,255,255,0.42);
	padding:12px 0px 10px;
}

header nav ul li{
	margin:0 1%;
}

header nav ul li a{
	font-size:2.3vw;
	font-weight:bold;
	color:#356cac;
	text-decoration:none;
}

header nav ul li a:hover{
	text-decoration:underline double;
}

div{
	width:95%;
	margin:0 auto 30px;
	display:flex-wrap;
	justify-content:space-between;
}

main{
	box-sizing:border-box;
	flex-basis:80%;
	background-color:#ffffff;
	border-radius:1.6vw;
	padding:clamp(14px,4.2vw,18px) 7.2vw clamp(14px,5.2vw,18px) 7.2vw;
	box-shadow:0px 0px 8px rgba(0,0,0,0.16);
	margin-bottom:24px;
}

section img{
	width:100%;
	height:auto;
	object-fit:cover;
}

.yuu img{
	width:90%;
	height:auto;
}

.niwashin img{
	width:90%;
	height:auto;
}

.yunika- img{
	width:90%;
	height:auto;
}

.kure-ma- img{
	width:90%;
	height:auto;
}

article h2{
	font-size:clamp(14px,4vw,18px;)
	font-weight:500;
	margin-bottom:8px;
	font-weight:bold;
}

time{
	background-color:#49bdf0;
	border-radius:0px 22px 22px 22px;
	font-size:clamp(14px,1.8vw,18px);
	font-weight:bold;
	color:#ffffff;
	padding:13px 25px 12px 20px;
	display:inline-block;
}

.postdate{
	margin-bottom:26px;
}

.eyecatch{
	margin-bottom:26px;
}

.eyecatch img{
	width:100%;
	height:auto;
}

article h3{
	border-bottom:2px solid #49bdf0;
	margin-bottom:20px;
	font-size:clamp(14px,2.8vw,18px;)
	font-weight:600;
	background-image:url(images/li1.PNG);
	background-repeat:no-repeat;
	background-position:left bottom;
	padding:2% 1% 1% 4.8%;
}

iframe{
	width:100%;
	height:705px;
}

.instagram {
	text-align: center;
}

.instagram img{
	width:300;
	height:auto;
	text-align:center;
}

.image-row {
	display:flex;
	width:auto;
	flex-wrap:wrap;
	margin: 0 auto 50px;
	justify-content:center;
	gap:20px;
}

.image-row img {
	width: 200px;
	height: 130px;
	box-shadow: 0 0 8px rgba(0,0,0,0.2);
}


footer{
	background-color:#356cac;
	color:#ffffff;
	text-align:center;
	padding:14px 10px 20px;
}

.record iframe{
	width:100%;
	height:860px;
}

.record_ele iframe{
	width:100%;
	height:940px;
}

.back-to-top{
	position:fixed;
	bottom:15px;
	right:15px;
	background:#356cac;
	color:white;
	padding:12px 16px;
	border-radius:50%;
	text-decoration:none;
	font-size:20px;
	box-shadow:0 0 8px rgba(0,0,0,0.3);
}

.back-to-top:hover{
	background:#49bdf0;
}