@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;
margin-top:15px;

}

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{

 background-image:url(photo/門司港レトロ夜景01.jpg);
 position:relative;
 background-size:cover;
 background-position:center;
 height:400px;
 text-align:center;
 
}




.home{

 color:#fff;
 font-size:large;
 width:100%;
 height:400px;
 animation-name:bof;
 animation-delay:1s;
 animation-duration:1s;
 animation-fill-mode:forwards;
 animation-timing-function:linear;
 opacity:0;
 padding:5px;
 box-sizing:border-box;
 max-width:100%;
 text-align:center;
 display:flex;
 justify-content:center;
 align-items:center;


}

@keyframes bof{

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





.home .double{

 
 max-width:80%;
 justify-content:center;
 align-items:center; 
 background-color:rgba(38,119,163,0.7);
 border-radius:10px;
 padding:15px;
 text-align:center;
 margin:0;
}

.home .double h2{

 font-size:xx-large;
 margin-bottom:0;

}


.home .double p{

 font-size:large;
 margin:0;

}



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

.toppost{

 padding:15px;

}


/*================メイン=================*/

.main{
 
 position:relative; 
 background-image:url();
 

}

.main .container div{

 color:#000;
 padding:20px;
 background-color:#d1e7ff;
 border-radius:10px;
 border:solid 5px #5496ff;

}

.main .container p{

 

}




/*==================特徴===================*/


.three{

 text-align:left;

}




/*=================強み================*/



.strong h2{

 text-align:center;

}

.strong .point{

 text-align:center;
 display:flex;
 justify-content:space-evenly;
 align-items:center;
 flex-wrap:wrap;
}

.strong .point div{

 border-radius:50%;
 border:solid 10px #5496ff;
 background:linear-gradient(to left,#a6ccff,#fff);
 width:210px;
 height:210px;
 padding:20px;
 text-align:center;
 display:flex;
 align-items:center;
 justify-content:center;

}

.strong .point div h3{

 text-align:center;
 font-size:x-large;
 margin:0;

}



/*===================お悩み=================*/

.onayami{

 margin-top:15px;

}

.onayami .demerit h2{

 letter-spacing:0.5em;
 margin-top:0;

}

.onayami .demerit{

 background-color:#fff8db;
 padding:40px;
 border-radius:5px;

}

.onayami .demerit p:not(:last-child){

 text-align:left;
 background-color:#ededed; 
 padding:20px;
 border-radius:10px;
 font-weight:bold;

}

.demerit h2:first-child{

 text-align:center;

}

.demerit h2:last-child{

 text-align:left;

}



/*==============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;

}

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


.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;


}


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


.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%;

}

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


 input,textarea{

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

}


label select{

 width:95%;
 padding:10px;

}

 .gaku{

  width:30%;
 
 }


 textarea{

  height:120px;

}

input[type="submit"]{

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

}

.contact h2{

 text-align:center;

}

.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:1025px){

.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 .double h2{

 font-size:xxx-large;

}


.home .double p{

 font-size:x-large;

}




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

.toppost{

 padding:0;

}


/*==================メイン===================*/

.main p{

 font-size:large;
 
}

/*===============強み================*/


.strong .point{

 justify-content:space-between; 
 padding-right:50px;
 padding-left:50px;

}

.strong div div h3{

 font-size:x-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%;

}

/*===================お悩み===================*/

.onayami .demerit p:not(:last-child){

 font-size:large;

｝


}

