* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

html {
height: 100%;
width: 100%;
}

body {
counter-reset: number 0;
text-align:left;
font-family: 'M PLUS 1', sans-serif;
font-weight:400;
font-size: 17px;  
line-height:1.9;
margin:0px;
padding:0px;
width: 100%;
text-size-adjust: 100%;
-webkit-text-size-adjust:100%;/*Chrome,Safari*/
-ms-text-size-adjust: 100%;/*EgdeMobile*/
-moz-text-size-adjust: 100%;/*firefox*/
word-break: break-all;
letter-spacing: 0.3px;
color:#444;
}

@media only screen and (max-width:680px){
body { 
font-size: 15px;
}
}



/* ヘッダー
-------------------------------------------------------------------------------------------- */
#sp_head{
display: none;
}
@media screen and (max-width:1023px)  {
#sp_head{
display: block;
padding:8px 0;
height:64px;
}
#sp_head img{
width:220px;
}
}

#logo {
width:160px;
top:28px;
left:30px;
position: fixed;
float:left;
z-index:99999;
display: inline-block;
}
#logo img{
width:160px;
height:auto;
}
@media screen and (max-width:1023px)  {
#logo{
z-index: 0;
position: absolute;
padding: 0 20px;
margin-top:14px;
top:0;
left:0;
}
}

.fixed #logo{
top:0px;
transition: 1s;
}

/* フッター上お問合せ欄 -------------------------- */
#footer_contact{
background: #ddf2fb;
background: -moz-linear-gradient( #eff7fb 0%, #ddf2fb 100%);
background: -webkit-gradient(linear, left top, left bottom, from(#eff7fb), to(#ddf2fb));
background: -webkit-linear-gradient( #eff7fb 0%, #ddf2fb 100%);
background: -o-linear-gradient( #eff7fb 0%, #ddf2fb 100%);
background: linear-gradient( #eff7fb 0%, #ddf2fb 100%);
width:100%;
padding:100px 0;
text-align: center;
}

#footer_contact h2{
margin-bottom:20px;
line-height:1.0;
}

.top_block_intro{
margin-bottom:30px;
}



#footer_contact a{
margin:0 auto;
font-size:22px;
font-weight:500;
display:block;
background-color:#46b4e1;
line-height:1.0;
max-width:700px;
width:86%;
border-radius:25px;
padding:20px;
color:#fff;
text-decoration:none;
padding: 20px 0 20px 30px;
background-image: url(../images/common/ico_mail.gif);
background-repeat: no-repeat;
background-size: 40px;
background-position:calc(50% - 90px) calc(50% + 1px);
}
@media only screen and (max-width:480px){
#footer_contact a{
font-size:20px;
background-size: 30px;
background-position:calc(50% - 74px) calc(50% + 1px);
}
}

/*　フッター　----------------------------------- */

footer{
padding:40px 30px;
text-align: center;
}

#footer_text_link{
text-align: center;
margin-bottom:40px;
}



#footer_text_link li{
display: inline-block;
margin:0 10px;
}
@media only screen and (max-width:1023px){
#footer_text_link li{
margin:0 8px;
font-size:15px
}
}
@media only screen and (max-width:767px){
#footer_text_link li{
display: none;
}
}


#footer_text_link li a{
text-decoration: none;
}

#footer_logo{
width:130px;
margin:0 auto 8px;
}

#footer_logo img{
width:100%;
height:auto;
}

adress{
font-size:15px;
margin-bottom:10px;
display: block;
line-height:1.5;
}
@media only screen and (max-width:480px){
adress{
font-size:14px;
}
}


img#footer_snslogo{
width:34px;
height:auto;
}

#copy{
font-size:14px;
}
@media only screen and (max-width:480px){
#copy{
font-size:12px;
max-height: 100%;
}
}




/*　共通仕様　----------------------------------- */




#topcontrol img{
width:60px;
height:auto;
}
@media screen and (max-width:680px)  {
#topcontrol img{
width:40px;
}
}

/*　共通仕様ボタン関連　----------------------------------- */
.btn_go{
position: relative;
font-weight: 400;
font-size:  16px;
border:#b0b0b0 solid 1px;
width:280px;
text-align: center;
margin:0 auto;
}
.btn_go a{
display: flex;
align-items: center;
transition-duration: .4s;
transition-property: color;
text-decoration: none;
justify-content: center;
padding:15px 20px;
font-size: 16px;
line-height:1.0;
color:#444;
}
.btn_go a:hover{
background-color:#ffecde;
transition: 0.5s;
}
.btn_go a::after{
content: '';
width: 25px;
height: 8px;
border-bottom: solid 1px #818181;
border-right: solid 1px #818181;
transform: skew(45deg);
margin: 0 0 2px 40px;
transition-duration: .4s;
transition-property: opacity;
}
.btn_go a:hover::after{
opacity: 0.6;
}

@media screen and (max-width:680px)  {
.btn_go a{
font-size: 15px;
}
}

.btn_more{
position: absolute;
bottom: -50px;
right:0;
font-size: 13px;
}

.btn_more a{
text-decoration: none;
font-size:14px;
display: flex;
align-items: center;
transition-duration: .4s;
transition-property: color;
margin-right: 15px;
}

.btn_more a::after {
content: '';
width: 30px;
height: 6px;
border-bottom: solid 1px #302210;
border-right: solid 1px #302210;
transform: skew(45deg);
margin:0 0 2px 15px;
transition-duration: .4s;
transition-property: opacity;
}

.btn_more a:hover{
color:#409fc6;
transition: 0.6s;
}

.btn_more a:hover::after{
border-bottom: solid 1px #409fc6;
border-right: solid 1px #409fc6;
transition: 0.6s;
}


footer a.go_map{
background-color: #219dcf;
padding: 3px 17px 3px 8px;
font-size: 12px;
text-decoration: none;
display: inline-block;
line-height: 1.0;
margin-left: 8px;
background-image: url(../images/common/angle-right-solid.svg);
background-repeat: no-repeat;
background-size: 6px;
color: #fff;
background-position: right 6px top 50%;
}


#k_ttl{
width:100%;
position: relative;
height:296px;
}
@media only screen and (max-width:680px){
#k_ttl{
height:auto;
}
}

#k_ttl_area_inner{
background-color:#e2f4fb;
width:75%;
margin-left:25%;
height:296px;
}

#k_ttl img{
position: absolute;
right:30px;
bottom:-70px;
width:650px;

}

#k_ttl_text{
position: absolute;
left:10%;
bottom:20px;
line-height:1.3;
}

#k_ttl h1{
font-size:24px;
font-weight:500;
letter-spacing:1px;
}

#ttl_en{
font-size:56px;
font-weight:800;
color:#409fc6;
letter-spacing:1px;
}
@media only screen and (max-width:1199px){
#k_ttl_text{
left:4%;
}
}


@media only screen and (max-width:1023px){
#k_ttl_area_inner{
background-color:#e2f4fb;
width:100%;
margin-left:0%;
height:90%
}
#k_ttl img {
right:3%;
max-width:90%;
bottom:-60px;
}
#k_ttl_text{
bottom:-150px;
left:5%;
}
}


@media only screen and (max-width:680px){
#k_ttl_area_inner{
background-color: #fff;
background-image: url("../images/common/sp_ttl_bg.png");
background-repeat: no-repeat;
background-size: 100%;
margin:0 auto ;
text-align: center;
}
#k_ttl img {
position: relative;
right:auto;
bottom:0;
max-width:90%;
padding-top:3%;
}
#k_ttl_text{
position: relative;
bottom:0;
left:0;
width:90%;
margin:0 auto;
}
#k_ttl h1{
font-size:18px;
text-align: left;
}

#ttl_en{
font-size:32px;
text-align: left;
}
}


#pan{
font-size:14px;
padding:30px 8px;
max-width:1100px;
width:90%;
margin:0 auto;
}
@media only screen and (max-width:1023px){
#pan{
padding-top:180px;
}
}
@media only screen and (max-width:680px){
#pan{
display: none;
}
}



#pan a{
text-decoration: none;
color:#444;
}

.cicle-design{
letter-spacing:-4px;
line-height:1.0;
font-size:30px;
}
@media only screen and (max-width:680px){
.cicle-design{
font-size:24px;
letter-spacing:-1px;
}
}

#sub h2{
font-size:30px;
color:#409fc6;
font-weight:800;
font-family: "M PLUS Rounded 1c";
}
@media only screen and (max-width:680px){
#sub h2{
font-size:26px;
}
}
@media only screen and (max-width:480px){
#sub h2{
font-size:24px;
}
}

.cicle-design span:first-child{
color:#f7ca89;
}
.cicle-design span:nth-child(2){
color:#cbdf97;
}
.cicle-design span:nth-child(3){
color:#a2dcd8;
}
.cicle-design span:last-child{
color:#7dcbf1;
}



/* 事業案内　------------------------------------------- */

#service_field{
background: #d3eaf3;
background: -moz-linear-gradient( #e8f3f7 0%, #d3eaf3 100%);
background: -webkit-gradient(linear, left top, left bottom, from(#e8f3f7), to(#d3eaf3));
background: -webkit-linear-gradient( #e8f3f7 0%, #d3eaf3 100%);
background: -o-linear-gradient( #e8f3f7 0%, #d3eaf3 100%);
background: linear-gradient( #e8f3f7 0%, #d3eaf3 100%);
text-align:center;
padding:82px 0 105px;
}


#service_field_inner{
max-width:1170px;
width:96%;
margin:0 auto;
background:#fff;
padding:45px 15px 85px;
}


@media only screen and (max-width:767px){
#service_field_inner{
width:80%;
margin:0 auto;
padding:25px 15px 45px;
}
}
@media only screen and (max-width:480px){
#service_field_inner{
width:90%;
padding:15px 10px 25px;
}
}

#service_field ul{
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
}
@media only screen and (max-width:767px){
#service_field ul{
display: block;
}
}

#service_field li{
float:left;
width:338px;
margin:0 21px;
position: relative;
}
#service_field li img{
width:338px;
height:auto;
margin-bottom:10px;
}
@media only screen and (max-width:1344px){
#service_field li{
width:28.9%;
}
#service_field li img{
width:100%;
}
}
@media only screen and (max-width:767px){
#service_field li{
float:none;
width:90%;
margin:0 auto 90px;
}
}
@media only screen and (max-width:480px){
#service_field li{
width:94%;
}
}

#service_field li > a{
text-decoration:none;
}


#service_field dt{
color:#346c83;
font-weight:500;
margin-bottom:20px;
font-size:18px;
}

#service_field dt span{
font-size:13px;
display:block;
}


#service_field dd{
text-align: left;
}
@media only screen and (max-width:480px){
#service_field dd{
text-align: left;
}
}


#topcontrol img{
width:60px;
height:60px;
}
@media only screen and (max-width:480px){
#topcontrol img{
width:52px;
height:48px;
}
}



