@charset "utf-8";

body {
font-family: sans-serif;
background-color: #fff0f5;
font-size: 14px;
line-height: 1.7;
color:#252525;
}

.container {
	margin: 0 auto;
	max-width: 900px;
	background-color: #fff;	
}

/* 
各パートにパディング、背景、テキスト色などを指定する
<div class="container">の子要素に指定する
*/

header {
padding: 20px;
background-image: url("../img/head-bg.jpg");
}


footer {
	padding: 20px 16px 10px 16px;
	background: #87ceeb;
}

/* 2カラム用 */

.parent {
	display: flex;
	flex-flow: column;
}

main {
	padding: 20px 30px;
}

.side {
	padding:20px;
	background-color: #b0e0e6;
}


@media only screen and (min-width: 768px) {
.parent {
	flex-flow: row;
}
main {
	flex: 1 1 auto;
	order: 2;
}
.side {
flex: 0 0 190px;
order: 1;
}
}


/* そのたCSS */

h1 {
color:#ff1493;
font-size: 35px;
}

h2 {
margin-top: 20px;
padding-bottom: 5px;
border-bottom: 2px solid #38a1db;
color:#38a1db;
}

h3 {
padding: 2px;
background-color: darkturquoise;
border-radius: 10px;
color:#fff;
text-align: center;
}



.blue{
	color:#38a1db;
}

.copyright {
	margin: 0;
	text-align: center;
	color: #fff;
}

img{
max-width:100%;
height:auto;
}

.migi{
margin:0 0 25px 25px;
float:right;
}

.hidari{
margin: 0 25px 25px 0;
float: left;
}

@media only screen and (max-width:767px){
img.migi, img.hidari{
display:block;margin:5px auto;
}
.migi,.hidari{
float:none;
}
}

/* リスト */

ul{
	padding-left: 0px;
}
li{
	border-bottom: dashed 1px darkturquoise;
	line-height: 2.5;
	list-style-position: inside;
	list-style-type: none;
	padding:0 10px;
	color: darkturquoise;
	font-weight: bold;
}