@charset "utf-8";
html {font-size: 62.5%;/*background-color: #F5F5F5;*/}
body {padding:0; margin:0;}
#mw_wrap ul{list-style-type: none; margin: 0; padding: 0;}

#mw_wrap {
	clear: both;
	width:100%;
	max-width: 1000px;
	padding: 0 0 5%;
	margin:0 auto;
	/*font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";*/
	/*font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";*/
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	color: #2D2D2D;	
	background-repeat: repeat;
}
p {padding:0; margin:0;}
a {text-decoration: none; color: #000;}
a img:hover{opacity: 0.7;}
.clear {clear:both;}
.sp {display:none;}
.Sml {font-size: 50%;}

.main {width: 100%; margin:0 auto;}
.main img{display: block;}

h3{width: 100%; margin: 0 auto 5%; font-size: 25px; font-weight: 600; text-align: center;}
.line_U{background:linear-gradient(transparent 60%, rgba(254,255,255,0.8) 60%);}


/*ITEM-----------------------------*/
.item_wrap{width: 100%; margin: 0 auto; padding-bottom: 5%; background: linear-gradient(90deg,#ecf3fa 0%, #ecf3fa 50%, #ffdfd5 50%, #ffdfd5 100%);}


.item_box{
	width: 100%;
	margin: 0 auto 3%;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-around;
	position: relative;
}
.item1{width: 40%; margin: 0 0 15%;}

.item2{width: 49.5%; margin: 10% 0 1%;}
.item2 img{width: 50%; display: block; margin: 0 0 2% 2%;}
.item2 img.ttl_l{width: 68%;}

.cmt{width: 99%; margin: 2% auto 0; font-size: 20px; text-align: left; line-height: 1.6em; font-weight: 400;}
.main_item{width: 90%; margin: 10% auto 3%;}

.credit{width: 28%;	margin: 0 auto 15%;	text-align: center; position: absolute; top: 12%; left: 36%;}
.credit img {width: 70%; margin: 2% auto 0;}
.item_n{font-size: 2.6rem; font-weight: 600; background-color: rgba(254,255,255,0.6); border-radius: 5px; padding: 2% 0;}
.item_p{font-size: 2.2rem;}
.item_d{font-size: 1.8rem;}
.tax{font-size: 80%;}
.sml{font-size: 80%;}
/*.credit a:hover{opacity: 0.7;}*/

.icon{
    transform-origin: center bottom;
    animation: yurayura 2s linear infinite;
}

@keyframes yurayura {
  0% , 100%{
      transform: rotate(3deg);
  }
  50%{
      transform: rotate(-3deg);
  }
}


/*.img_box {
	position: relative;
	width: 100%;
	max-width: 80%;
	height: 600px;
	margin: 0 auto 2%;
}

.image {
	position: absolute;
	width: 100%;
	opacity: 0;
	animation: change-img-anim 9s infinite;
}

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

@keyframes change-img-anim {
  0%{ opacity: 0;}
 23%{ opacity: 1;}
  33%{ opacity: 1;}
  63%{ opacity: 0;}
  100%{ opacity: 0;}
}*/


/* General button style (reset) */
.btn {
	border: none;
	letter-spacing: 1px;
	outline: none;
	/*position: relative;*/
	/*-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;*/
    display: block;
	text-align: center;
    padding: 14px 0px;
    font-size: 2rem;
	letter-spacing: 2px;
	font-weight: 500;
	border-radius: 10px;
    margin: 3% auto;
}

/* Button 1 */
.btn-1 {
	width: 40%;
    border: #D36033 1px solid;
    color: #D36033;
    background-color: #fff;
}

.btn:hover {
	color: #fff;
	background-color: #3A3A3A;
	border: #3A3A3A 1px solid;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
/* Button 2 */
.btn-2 {
	width: 40%;
    /*border: #2D2D2D 1px solid;*/
    color: #1F1F1F;
    background-color: #AECCE1;
}

@media only screen and (max-width: 750px) {
	.pc {display:none;}
	.sp {display:block;}
	.Sml {font-size: 1.5rem;}
	
	#mw_wrap {width:100%; padding: 0 0 5%; margin:0 auto 10px;}
	
	.main {width: 100%; margin:0 auto;}
	.img_box {position: relative; width: 100%; height: 70vw; margin: 0 auto 2%;}
	h3{width: 100%; margin: 10% auto 5%; font-size: 16px;}
/*ITEM*/
	.item_wrap{width: 100%; margin: 0 auto;}
	.item_box{
		width: 95%;
		margin: 0 auto 3%;
		justify-content: space-between;
	}
	.item1{width: 43%; margin: 0 0 15%;}
	
	.cmt{ width: 100%; font-size: 13px;}
	
	.credit{width: 37%;	margin: 0 auto 15%;	text-align: center; position: absolute; top: 5%; left: 29.5%;}
	.credit1{position: absolute; top: 2%; left: 31.5%;}
	.credit img {width: 73%; margin: 0 auto;}
	.item_n{font-size: 14px; font-weight: 500; line-height: 1.3em;}
	.item_p{font-size: 14px;}
	.item_d{font-size: 12px;}

	/* Button 2 */
	.btn {
		width: 65%;
		margin: 5% auto 6%;
		padding: 5px 0px;
		font-size: 1.6rem;
		font-weight: 500;
		border-radius: 6px;
	}

	/*.btn_ALL{
		width: 85%;
		margin: 30% auto 10%;
	}*/
}