@charset "utf-8";

/* root/ikebukuro/salon/
------------------------------------------ */


/* メインコンテンツ article
------------------------------------------ */
article{
	width: 93.48%;
	max-width: 718px;
	padding:2% 3.26% 0;
}

article h1{
	box-sizing: border-box;
	width: 100%;
	padding:1% 2%;
	background-color: #6464c5;
}

article h1 img{
	width: 61.1%;
}

article p.remarks{
	width: 90%;
	padding: 1.5% 5% 0;
	line-height: 1.4em;
}


@media screen and (min-width:769px) {
	article{
		max-width: 960px;
		margin: 0 auto;
	}
	
	article h1 img{
		width: 45.7%;
	}
}


/* section
------------------------------------------ */
section {
	width: 96%;
	margin: 3% 2% 0;
}

section h2{
	margin-top: 5%;
}

section div.box1{
	width: 85%;
	margin-top: 2%;
	padding: 5% 7.5%;
	background-color: #eeda80;
}

section div.box1 p{
	font-size: 1.1em;
	line-height: 1.7em;
	text-align: justify;
}

section div.box1 ul{
	width: 100%;
	margin: 5% 0;
	overflow: hidden;
}

section div.box1 ul li{
	float: left;
	margin-right: 1em;
}

section div.box1 ul li span{
	color: #ff4628;
}

section div.box1 ul li a{
	color: #368738;
}


section div.box2{
	width: 100%;
	margin-top: 2%;
	background-color: #e7edf7;
}

section div.box2 p{
	width: 80%;
	padding: 0 10%;
}

section div.box3{
	border: #eeda80 solid 1px;
	width: 96%;
	margin-top: 2%;
	padding: 2%;	
}

section div.box3 h3{
	width: 100%;
	overflow: hidden;
	color: #b81c22;
	/*font-size: 18px;*/
	/*font-size: 22px;*/
	font-size: 21px;
	
	padding: 0px 0 1px;
	line-height: 30px;
	
/*  color          : #ffffff;             文字の色 */
  text-shadow    : 
      1px 1px 1px #ffffff;
/* 	  1px 1px 1px #1d1717;
       2px  2px 1px #1d1717,
      -2px  2px 1px #1d1717,
       2px -2px 1px #1d1717,
      -2px -2px 1px #1d1717,
       2px  0px 1px #1d1717,
       0px  2px 1px #1d1717,
      -2px  0px 1px #1d1717,
       0px -2px 1px #1d1717; */       /* 文字の影 */
	
	
	
}

section div.box3 h3 span{
	float: left;
	display: inline-block;
	background-color: #b81c22;
	color: #ffffff;
	font-size: 14px;
	line-height: 2em;
	padding: 0 5px;
	margin-right: 5px;
	text-shadow: 0px 0px 0px #fff;
}

section div.box3 dl{
	margin-top: 3%;
}

section div.box3 dl dt{
	font-weight: bold;
}

section div.box3 dl dd{
	margin-top: 2%;
	line-height: 1.5em;
	text-align: justify;
}





section div.box4{
	width: 96%;
	margin-top: 2%;
	padding: 2%;
	background-color:#edede3;
}

section div.box4 h4{
display:flex;
align-items:center;
color:#b6007e;
font-size:20px;
font-weight:bold;
}

section div.box4 h4:after{
margin-left:5px;
border-top:1px solid #b6007e;
content:"";
flex-grow:1;
}






section div.box4.lec div.talk{
overflow:hidden;
width:100%;
margin-top:10px;
/*padding:12px;*/
}

section div.box4.lec div.talk p{
float:left;
width:35%;
}

section div.box4.lec div.talk dl{
float:right;
width:63%;
}

section div.box4.lec div.talk dl dt{
font-size:1.1em;
line-height:1.4em;
font-weight: bold;
}

section div.box4.lec div.talk dl dd{
margin-top:5px;
line-height:1.4em;
text-align: justify;
}






section div.box4.lec div.lecturer{
overflow:hidden;
width:100%;
margin-top:10px;
/*padding:12px;*/
}

section div.box4.lec div.lecturer p{
float:left;
width:35%;
}

section div.box4.lec div.lecturer dl{
float:right;
width:63%;
}

section div.box4.lec div.lecturer dl dt{
font-size:1.1em;
line-height:1.4em;
font-weight: bold;
}

section div.box4.lec div.lecturer dl dd{
margin-top:5px;
line-height:1.4em;
text-align: justify;
}

section div.box4.offer > div{
	margin: 10px 0 10px;
}

section div.box4.offer > div dl{
display:-webkit-flex;
display:flex;
}

section div.box4.offer > div dl dt{
white-space:nowrap;
	line-height: 1.4em;
}

section div.box4.offer > div dl dt span{
display:inline-block;
width:4em;
-moz-text-align-last: justify;
text-align-last: justify;
}

section div.box4.offer > div dl dd{
	line-height: 1.4em;
}

section div.box4.offer > div dl dd div{
	font-size: 0.9em;
	line-height: 1.2em;
	padding-left: 1em;
	text-indent: -1em;
}

section div.box4.offer > dl dt{
	color: #c53232;
}

section div.box4.offer > dl dd li{
line-height:1.4em;
padding-left:1em;
text-indent:-1em;
}




@media screen and (min-width:769px) {
	section h2 img{
		width: 50%;
		margin-bottom: 2%;
	}

	section div.wrap{
		background:linear-gradient(90deg,#eeda80 0%,#eeda80 50%,#e7edf7 50%,#e7edf7 100%);
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
        align-items: center;
	}
	
	section div.box1{
		box-sizing: border-box;
		margin-top: 0;
		width: 85%;
		padding: 1% 7.5%;
	}
	
	section div.box2{
		margin-top: 0;
	}
		
	section div.box2 p{
		width: 70%;
		margin: 0;
		padding: 0 15%;
	}

	section div.wrap2{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}

	section div.wrap2 div.box3{
		width: 45%;
	}

	section div.wrap2 div.box4{
		width: 45%;
	}
}



/* 
------------------------------------------ */
p.totop{
	text-align: right;
	color: #ff4628;
	margin-top: 1.5%;
	padding-right: 2.5%;
	font-size: 0.9em;
}

p.totop a{
	color: #368d38;
	text-decoration: none;
}

p.totop a:hover{
	color: #ff4628;
}


@media screen and (min-width:769px) {
	p.totop{
		max-width: 960px;
		margin: 22px auto 0;
	}
}