@charset "UTF-8";


/* テキストの自動拡大を無効化 */
body {
 -webkit-text-size-adjust: none;	
 text-size-adjust: none;     
}

/*=========ページ全体の設定============= */

body{
 margin:0;
 font-family: 'Noto Serif JP', serif;
 font-family: 'Exo 2', sans-serif;
 font-family:sans-serif;

}


#wrapper{

max-width:100%;

}



.container p{

 line-height:1.8;

}

/* リンク */
a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	opacity: 0.7;
}




/*============ヘッダー==============*/





header{

position:relative;
font-size:20px;
font-weight:bold;
text-align:left;
color:#02AEF7;
letter-spacing:0.1em;
padding-top:0;
padding-bottom:0;
padding-left:0;
min-height:50px;

background-color:#fff;

}

header .container{

 
 width:95%;

}

header .head{

 display:flex;
 justify-content:spase-between; 
 width:100%;  

}

header .head div{

 display:flex;
 flex-direction:column;
 
 
}



header h3{

 margin:0;

}

header .dami p{

 text-align:right;
 margin:0; 
 

}

header p{

 margin:0; 

}


/*=================ナビゲーション=================*/

.headlist{

 background-color:#266ba3;
 width:100%;
}

nav ul{

 list-style-type:none;
 width:100%; 
 padding:0;
 display:flex;
 justify-content:space-between;
 margin-bottom:0;
 border-top:3px double #f1f1f1;
 border-bottom:3px double #f1f1f1;

}

nav ul li{

 box-sizing:border-box;
 width:20%;
 text-align:center; 
 margin:0;
 color:#fff;
 border-right:solid 3px #fff;
 padding-top:5px;
 padding-bottom:5px;
}

nav ul li:not(:last-child){

 

}

/*================ホーム================*/

.white{

 position:relative;
 background-size:cover;
 background-position:center;
 height:450px;
 display:flex;
 align-items:center;
 background:linear-gradient(to bottom right,#215cff 0%,#fff 15% 65%,#215cff 90% 100%);
 animation-name:boff;
 animation-duration:1s;
 animation-fill-mode:forwards;
 animation-timing-function:step-end;

}

@keyframes boff{

 0%{background:linear-gradient(to bottom right,#45f3ff 35%,#45f3ff 65% 100%);opacity:0.7;}
 50%{background:linear-gradient(to bottom right,#45f3ff 30%,#fff 35%,#45f3ff 40% 100%);}
 100%{background:linear-gradient(to bottom right,#45f3ff 0%,#fff 15% 60%,#45f3ff 90% 100%);opacity:1;}
}



.home{

 color:#10237a;
 font-size:large;
 display:flex;
 flex-wrap:wrap;
 width:100%;
 animation-name:bof;
 animation-delay:1s;
 animation-duration:2s;
 animation-fill-mode:forwards;
 animation-timing-function:linear;
 opacity:0;

}

@keyframes bof{

 0%{opacity:0;}
 50%{opacity:0.5;}
 100%{opacity:1;}
}





.home .double{

 display:flex;
 width:100%;
 justify-content:space-between;
 align-items:center; 
 

}

.home .double div:nth-child(1){

 margin:0;
 width:80%;
 text-align:left;
 text-shadow:1px 1px 1px #444444;
 
}

.home .double div:nth-child(2){

 width:20%;
 text-align:right; 

}

/*==========================限定=========================*/

.exclusive{

 font-size:x-large;
 font-weight:bold;
 

}



/*===============トップポスト===============*/

.toppost{

 padding:15px;

}

/*===============プロフィール==============*/


.profile h2{

 text-align:center;

}

.profile .container div{

 position:relative;
 background-color:#fff5e3;
 border-radius:10px;
 padding:10px;

}

.profile .container div:before{

 content:"";
 position:absolute;
 border:30px solid transparent;
 border-bottom:30px solid #fff5e3;
 top:-50px;
 left:45%;
}


.profile img{

 height:150px;
 width:150px;
 border-radius:50%; 

}

.profile figure{

 text-align:center;


}















/*================お試し=================*/


.otameshi .container h2{

 text-align:center;

}

.otameshi .container div{

 
 border:solid 3px #cfe5ff;
 padding:15px;


}





/*==============Q&A================*/

.case{


 background-image:url();
 background-size:cover;
 background-position:center;

}

.case h2{

 text-align:center;
 

}

.case h3{

 font-size:large;

}

.case .question{

 border:solid 3px #b2bbc2;
 padding:15px;
 

}


.case .anser{

 border:solid 3px #b2bbc2;
 padding:15px;
 background-color:#cfe5ff;
 margin-bottom:50px;

}


.yajirushi{

 width:18px;
 height:18px;
 margin:0.1px;
 border-bottom:4px solid #000;
 border-right:4px solid #000;
 transform:rotate(45deg);
 text-align:center;
 margin-top:20px;
 margin-bottom:20px;
 margin-left:auto;
 margin-right:auto;

}




/*================地図==================*/


.container .post{

max-width:100%;
margin-bottom:15px;


}

.container .post h2{

 text-align:center;

}

.container .post ul{
 
 padding :0;
 list-style-type:none;
 display:flex;
 justify-content:center;
 align-itmes:center;
 flex-wrap:wrap;
 width:100%; 
 
 margin:0;
}




.container .post ul li:first-child{

 
 border:solid 1px #cccccc;
 padding:5px;
 margin:0;
 text-align:left;
 display:flex;
 align-items:center;
 justify-content:center;
 background-color:#e6e6e6;
 word-wrap:break-all; 
 box-sizing:boder-box;
 
 width:100%;

}

.container .post ul li:nth-child(2){

 text-align:left;
 border:solid 1px #cccccc;
 padding:5px;
 margin:0;
 word-wrap:break-word; 
 overflow-wrap:break-word;
 width:100%;
 box-sizing:boder-box;

}

.container .post ul li p{

 width:100%;
 margin:0;

}

.container iframe{

 width:100%;

}

/*=================お問い合わせ=================*/

.contact h2{

 text-align:center; 

}

/*==================お問い合わせver2=================*/

label select{

 width:95%;
 padding:10px;

}

 input,textarea{

  width:100%;
  box-sizing:border-box;
  padding:10px;

}

 textarea{

  height:120px;

}

input[type="submit"]{

 background-color:#ffaa00;
 border:none;
 -webkit-appearance:none; 
 width:50%;
 pointer:;
 cursor:pointer;
 border-radius:10px;

}

.sanks{

 position:fixed;
 top:0; 
 left:0;
 width:100vw; 
 height:100vh;
 background-color:rgba(0,0,0,0.5);
 margin:0;
 display:flex;
 justify-content:center;
 align-items:center;
 align-content:flex-end;
 text-align:center;
 visibility:visible;

}

.sanksno{

 position:fixed;
 opacity:0;
 visibility:hidden;
 height:0; 
 top:0;

}

.sanksmes{
 
 position:fixed;
 width:80%;
 background-color:white;
 border-radius:10px;
 border:5px solid #02AEF7; 
 text-align:center;
 padding-top:10px;
 padding-bottom:10px;

}

.sankscloss p{
 
 border:2px solid black;
 width:30%;
 text-align:center;
 margin-right:auto; 
 margin-left:auto;
 border-radius:10px;

}



/*================フッター===============*/

footer{

 text-align:center;
 margin:0;
 padding-bottom:15px;

}



/*=============PC版設定=============*/

@media (min-width:800px){

.container{

width:100%;
max-width:1100px;
margin-left:auto;
margin-right:auto;
}

.Notice{

max-width:1100px;
margin-left:auto;
margin-right:auto;


}

.Notice .text{

 width:auto; 

}

.message{

max-width:1100px;
margin-left:auto;
margin-right:auto;

}



/*==========ホーム=========*/

.home{

 font-size:x-large;

}

.white{

 background:linear-gradient(to bottom right,#215cff 0%,#215cff 20%,#fff 30% ,#fff 60%,#215cff 85%,#215cff 100%);
 animation-name:boff;
 animation-duration:1s;
 animation-fill-mode:forwards;
 animation-timing-function:step-end;

}

@keyframes boff{

 0%{background:linear-gradient(to bottom right,#45f3ff 40%,#45f3ff 40% 100%);opacity:0.7;}
 50%{background:linear-gradient(to bottom right,#45f3ff 0%,#45f3ff 35%,#fff 40%,#45f3ff 45% 100%);}
 100%{background:linear-gradient(to bottom right,#45f3ff 0% 5%,#fff 15% 60%,#45f3ff 85% 100%);}
}

/*===============トップポスト===============*/

.toppost{

 padding:0;

}


/*=================お試し================*/

.otameshi .container div p{

 
 font-size:large;


}

.otameshi .container div h3{

 font-size:xx-large;

}



/*===================Q&A=================*/

.case h3{

 font-size:x-large;

}

.case p{

 font-size:large;

}

/*===============プロフィール==============*/

.profile img{

 height:250px;
 width:250px;
 border-radius:50%; 

}

.profile p{

 font-size:large;

}


/*=================地図===================*/

.container .post ul{

flex-wrap:nowrap;

}


.container .post ul li:first-child{

 text-align:center;
 width:30%;

}

.container .post ul li:nth-child(2){

 
 width:70%;
 

}

/*=================お問い合わせ=================*/

.contact p{

 font-size:large; 

}

input[type="submit"]{

 width:30%;
 
}

.sanksmes{
 
 width:50%;
 
}

.sankscloss p{

 cursor:pointer;

}


}



