@charset "UTF-8";
* {
     margin: 0;
    padding: 0;
   font: 1em/1.7 "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo, "ＭＳ Ｐゴシック", sans-serif;

}
/*ヘッダー*/
header {
    max-width: 1100px;
    margin: 0 auto;
}
a {
	font-weight: bold;
}
@media (max-width: 1200px) { 
header {
    margin: 0 2%;
}
}

header p{
    padding-bottom: 0;
}

.hea{
    display: flex;
    justify-content: space-between;
    position: relative;
    top: 0;
    z-index: 100;
    padding: 10px 0;
}

.area_tit{
    display: flex; 
}

.he_le p{
    font-weight: bold;
}

.area_tit p{
     font-size: 15px;  
}

.area{
    padding: 2px 10px;
    background-color: #194f8c;
    color: #fff;
    margin: 0 10px 0 0;
}

.sb_tit{
     padding: 2px 0;  
}

p.logo{
    font-size: 32px;
    color: #194f8c;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color emoji;
}

.he_ri p{
    font-size: 14px;
    text-align: center;
    line-height: 1.4;
}

.he_ri p.tel{
    font-size: 2.5em;
    font-weight: bold;
}
.he_ri img {
    width: 80%;
    margin: 0 auto;
    display: block;
}
.tel_ic{
      display: none;  
}

/*----------sp------------*/
@media (max-width: 767px) { 
    
header {
    width: 100%;
    margin: 0;
}

.hea{
    padding: 4px 2% 2px 2%;
}
.he_le {
    width: 45%;
}
.he_ri {
    width: 48%;
    margin-left: 2%;
}
.area_tit{
    display: inline; 
}

.area_tit p{
     font-size: 13px;
     display: inline-block;
}

.area{
    padding: 2px 8px;
    margin: 0 2px 0 0;
}

p.logo{
    font-size: 24px;
}

.he_ri img{
    width: 68%;
}
.he_le img {
    width: 100%;
}

.tel_ic{
    display: block;
}
.he_ri p {
    font-size: 1.4em!important;
}
}




/*フッター*/

footer{
    background-color: #1eb0c7;
}

footer p{
    padding-bottom: 0;
}

.foo{
	display: flex;
    font-size: 12px;
    color: #fff;
    padding: 4% 0%;
    margin: 2% auto 0;
    justify-content: center;
    align-items: center;
}
.foo img {
    width: 12%;
    padding-right: 2%;
}
/*----------sp------------*/
@media (max-width: 767px) { 

.foo{
	display: flex;
    font-size: 12px;
    color: #fff;
    padding: 7% 3%;
    margin-top: 5%;
}
.foo img {
    width: 45%;
    padding-right: 3%;
}

}
