@charset "utf-8";
html {font-size: 62.5%; background-color: #F9F5F6; padding: 0;}
body{padding: 0; margin-top: 0;}
a{color: #000; text-decoration: none;}

#UT_wrap {
	clear: both;
	width: 550px;
	padding: 0 0 5%;
	margin:0 auto;
	/*font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";*/
	/*font-family: 'Noto Serif JP', serif;*/
	/*font-family: 'Noto Sans JP', sans-serif;*/
	 font-family: "Source Serif 4", serif;
	color: #000000;	
	background-color: #fff;
}


.main {
	width: 100%;
	margin:0 auto;
	padding: 0;
	/*background-color: #07283e;
	position: relative;
	height: 720px;*/
}

.ttl_1{width: 80%; position: absolute; top: 15%; left: 0;}
.ttl_2{width: 85%; position: absolute; top: 8%; right: 5%;}
.ttl_3{width: 40%; position: absolute; bottom: 10%; left: 5%;}


.Lead_pc {
	width: 91%;
	margin: 8% auto 12%;
	display: block;
	text-align:left;
	font-size:16px;
	padding:0 ;
	line-height: 1.8em;
}

.Lead_sp {display: none;}


.sp {display:none;}
.clear {clear:both;}
.bold {font-size: 125%; font-weight: bold;}

/*.prof_box {	width: 80%;	margin: 15% auto 20% ; padding: 8%; background-color: #EBEBEB; box-sizing: border-box;	}


.prof_box .profimg{	width: 60%;	margin: 0 auto ;}
.prof_box .proftxt{	width: 100%;	margin: 10% auto 0;	text-align: left;	font-size: 14px; line-height: 1.8em;}

.prof_box .profname{width: 100%;	margin: 0 0 1% 0 ;	text-align: left;	font-size: 16px;	font-weight: bold;}
.sns{width: 80%;	margin: 8% 0 0 20%; display:flex;	flex-wrap:wrap;	justify-content: space-between; align-items: center;}
.sns_txt{width: 82%; font-size: 13px; text-align: right;}
.sns_img{width: 15%; font-size: 13px;}*/

/*#UT_wrap h1{margin: 15% auto 3%; font-size: 3rem; font-weight: 500; letter-spacing: 2px; text-align: center; font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"}
#UT_wrap h2{margin: 10% auto 3%; font-size: 2rem; font-weight: 500; letter-spacing: 1px; text-align: center; font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"}*/
.ind{padding-left:1.2em; text-indent:-1.2em;}

a img:hover{opacity: 0.8;}
hr{width: 80%; margin: 20% auto 10%; }
h3{width: 100%; margin: 5% auto 0; font-size: 24px; text-align: center; font-weight: 600;}

.subttl{width: 100%; margin: 0 0 10%; font-size: 30px; }

.item_BOX1{width: 100%; margin: 5% auto 0; display:flex;	flex-wrap:wrap;	justify-content: space-between; align-items: center;}
.item1_1{width: 60%; margin: 0;}
.item1_2{width: 38%; margin: 0;}

.item_BOX2{width: 100%; margin: 5% auto 0; display:flex;	flex-wrap:wrap;	justify-content: space-between; align-items: center;}
.item2_1{width: 50%; margin: 0;}
.item2_2{width: 46%; margin: 0 auto;}

.flex_ST{align-items: flex-start;}
.MR_T5{margin-top: 5%;}
.MR_T10{margin-top: 10%;}

.item_BOX5{width: 100%; margin: 10% auto; display:flex;	flex-wrap:wrap;	justify-content: space-between; }
.item5_1{width: 50%; margin: 0; padding-left: 3%; box-sizing: border-box;}
.item5_2{width: 50%; margin: 2% 0 0;;}

.item_BOX5 img{margin-bottom: 5%;}

.item5_3{width: 40.5%; margin: 5% 0;}
.item5_4{width: 57%; margin: 5% 0;}


.item_BOX6{width: 96%; margin: 5% auto 5%; display:flex;	flex-wrap:wrap;	justify-content: space-between; align-items: center; }
.item6_1{width: 48%; margin: 0 0 2%;}

/*
.voice{width: 40%; margin: 2% 0 0; padding: 5px ; font-size: 14px; letter-spacing: 1px; text-align: center; background-color: #07283e; color: #fff; }
.cmt{width: 98%; margin: 2% auto 0; font-size: 15px; text-align: left; line-height: 1.8em;}
.cmt2{width: 98%; margin: 2% auto 0; font-size: 14px; text-align: center; line-height: 1.7em;}
.cmt4{width: 100%; margin: 2% auto 0; font-size: 13px; text-align: center; line-height: 1.7em;}*/

.credit_BOX{
	width: 90%;
	margin: 0;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	align-items: center;
	text-align: left;
	font-family: 'Noto Sans JP', sans-serif;
}
.txt{width: 52%; margin: 0 auto 5%; box-sizing: border-box; font-size: 14px; line-height: 1.2em;}
.item_p{width: 38%;	margin: 0 auto 5%;	box-sizing: border-box; font-size: 12px;}
.buybtn{width: 10%;	margin: 0 auto 5%;	box-sizing: border-box; text-decoration: underline; font-size: 12px;}
.tax{font-size: 70%;}

.cmt3{width: 100%; margin: 2% 0 0; font-size: 12px; text-align: left; }

.btn_BOX{width: 80%; margin: 20% auto 5%; font-size: 34px; text-align: center; text-decoration: underline;}
.logo_BOX{width: 30%; margin: 15% auto 1%;}

.staff_BOX{width: 100%; margin: 20% auto; font-size: 13px; text-align: center; line-height: 1.8em; }

/*.archive_BOX{width: 90%; margin: 3% auto 1%;	display:flex;	flex-wrap:wrap;	justify-content: space-between;}
.archive_01{width: 45%; margin: 3% auto 1%;}



*/

/* General button style (reset) */
.btn {
	border: none;
	font-family: inherit;
	color: inherit;
	background: none;
	cursor: pointer;
	display: inline-block;
	margin: 2% auto 8%;
	font-weight: 500;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	text-align: center;
	
}


/* Button 1 */
.btn-1 {
	width: 100%;
    /*border: #bcdacd 1px solid;*/
    color: #fff;
    text-align: center;
    margin: 5% auto;
    display: inline;
    padding: 4px 0px;
    font-size: 14px;
    background-color: #000;
	font-family: 'Noto Sans JP', sans-serif; 
	letter-spacing: 2px;
}

.btn-1:hover {
	color: #fff;
	background-color: #767676;
	/*border: solid 1px #767676;*/
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

/* Button 2 */
.btn-2 {
	width: 100%;
   /* border: #e5790f 1px solid;*/
    color: #000;
    text-align: center;
    margin: 0% auto 5%;
    display: block;
    padding: 15px 0px;
    font-size: 25px;
    background-color: #fff;
	letter-spacing: 2px;
	text-decoration: underline;
}

.btn-2:hover {
	color: #fff;
	background-color: #5A5A5A;
	/*border: solid 1px #707070;*/
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

/*.img_box {width: 100%; margin: 0 auto 2%;}

.img_box {
	position: relative;
	width: 100%;
	height: 570px;
	margin: 0 auto 1%;
}*/

/* スライダ―のCSS */
/*.slider { width: 100%;  display: flex; gap: 10px;  overflow-x: auto;}
.slide {width: 600px;}
.slide img { width: 425px; max-width: 425px;}
*/
/*.image {
	position: absolute;
	width: 100%;
	opacity: 0;
	animation: change-img-anim 6s infinite;
}

.image:nth-of-type(1) {
	animation-delay: 0s;
}
.image:nth-of-type(2) {
	animation-delay: 3s;
}

@keyframes change-img-anim {
	0%{ opacity: 0;}
	25%{ opacity: 1;}
	50%{ opacity: 1;}
	75%{ opacity: 0;}
	100%{ opacity: 0;}
}

*/

.arrow {
  position: relative;
  display: inline-block;
  width: 19%;
  height: 1px;
  margin-top: 12px;
  border-radius: 9999px;
  background-color: #000000;
	bottom: 0;
	left: 80%;
}

.arrow::before {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  right: 0;
  width: 20px;
  height: 1px;
  border-radius: 9999px;
  background-color: #000000;
  transform: rotate(25deg);
  transform-origin: calc(100% - 1px) 50%;
}

@media only screen and (max-width: 750px) {
	html {background-color: #fff;}
	#UT_wrap {width:100%; margin:0 auto 20px;}
	/*#UT_wrap .main {width: 100%; margin:0 auto;}*/

	.pc {display:none;}
	.sp {display:block;}
	.Lead_pc {display: none;}
	
	
	
	.main {width: 100%; margin:0 auto; padding: 0;/* height: 150vw;*/}
	.ttl_3{width: 40%; position: absolute; bottom: 5%; left: 5%;}

	.Lead_sp {
		width: 90%;
		display: block;
		text-align: left;
		font-size: 14px;
		margin:10% auto 12%;
		line-height: 1.8em;
	}
	
	


	.subttl{width: 100%; margin: 0 0 5%; font-size: 25px; }
	
	.credit_BOX{width: 90%;	margin: 0 ;}
	.txt{ margin: 0 auto 5%; font-size:11px;	}
	.item_p{font-size: 11px;}
	.buybtn{margin: 0 auto 5%; font-size: 11px;}

	/*.img_box {width: 100%;	height: 120vw;	margin: 0 auto 2%;}*/
	
	.btn_BOX{width: 80%; margin: 20% auto 5%; font-size: 26px; }

	.logo_BOX{width: 30%; margin: 15% auto 5%;}
	.archive_BOX{width: 80%; margin: 3% auto 1%;}
	.staff_BOX{width: 100%; margin: 20% auto; font-size: 13px;  text-align: center; line-height: 1.7em;}
		
	/*.cmt2{width: 98%; margin: 2% auto 0; font-size: 12px;}
	
	.slider {    width: 100%;    display: flex;    gap: 5px;    overflow-x: auto;}
	.slide {width: 500px;}
	.slide img { width: 350px; max-width: 390px;}*/

/* Button 1 */
	.btn-1 {
		width: 100%;
		margin: 5% auto;
		padding: 5px 0px;
		font-size: 13px;
	}
	
/* Button 2 */
	.btn-2 {
		width: 100%;
		margin: 0 auto 5%;
		padding: 10px 0px;
		font-size: 16px;
	}


}