@charset "UTF-8";

body, html {
   height: 100%;
   background-color: #FFE9F6;
   line-height: 1.77;
   color: #4a4a4a;
   font-family: sans-serif;
   margin: 0;
   padding: 0;
 }

 p {
   line-height: 1.77;
   color: #4a4a4a;
   font-family: sans-serif;
   margin: 0;
   padding: 0;
 }

 h1, h2, h3, h4, h5, h6 {
   line-height: 1.77;
   font-size: 18px;
   color: #4a4a4a;
   font-family: sans-serif;
   margin: 0;
   padding: 0;
 }

body {font-size: 14px;}

/* 基本設定： ページ全体 */
body {
    border-top: solid 10px #DA549B;
    padding: 0;
	margin: 0;
	font-family: 'メイリオ',
		'Hiragino Kaku Gothic Pro', 
		sans-serif;
}

.container {
    max-width: 700px;
    width: 100%;
    margin: 0 auto;

}

header {
    text-align: center;
}

header h1 {
    padding: 30px 10px 10px 30px;
}

header h1 img {
    width: 50vw;
}

header p {
    margin-top: 10px;
    margin-bottom: 30px;
    font-size: 14px;
}

@media(min-width: 700px){
	header h1 img{
		width: 250px;
	}
	header p {
	    font-size: 16px;
	}
}

.bannerarea {
 
}

.bannerarea1{
    display: flex;
}




.b {
    max-width: 345px;
    width: 50vw;
    padding-right: 5px;
}

.b:hover{
    opacity: 0.7;
}

.prof {
    max-width: 700px;
    width: 100vw;
    margin-bottom:50px;
    
}

.prof:hover{
    opacity: 0.7;
}


@media(min-width: 700px){
.bannerarea1 {
    margin:0 auto;
}

.bannerarea2 {
    margin: 0 auto;
}

.b {
    width: 345px;
    padding-right: 5px;
}

.prof {
    width: 700px;
    
}
}

.popo_f{
    width:100%;
}