/* CSS Document */
*,
*:before,
*:after {
  box-sizing: inherit;
}

html {
  box-sizing: border-box; height:100%;
}
body{ background:#fff; height:100%; color:#221814; position:relative;}
a{ color:#221814;}
h1,h2,h3,p{ line-height:1.4em;}
img{ max-width:100%; vertical-align:bottom;}
.sp{ display:none;}
p{ font-size:1.6rem; line-height:1.8em; margin:0 auto; font-weight:500; text-align:left;}
.center{ text-align:center;}

/*トグルボタン*/
#menubtn{
	width:40px;
	height:41px;
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 3;
	border:1px solid #7d8488;
    border-radius: 4px;        /* CSS3草案 */  
    -webkit-border-radius: 4px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 4px;   /* Firefox用 */
	font-family:Arial, Helvetica, sans-serif;
	}
header #menubtn{display:none;}

#menubtn #menubtn_line{
    width: 40px;
    height:40px;
    position: absolute;
    top: 0px;
    right: 0px;
	
}
#menubtn #menubtn_line span {
    display: block;
    background: #7d8488;
    width:   23px;
    height: 2px;
    position: absolute;
    left: 9px;
    transition: all 0.4s;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
}
#menubtn p{color:#FEFEFE; position:absolute; bottom:3px; left:8px;}
#menubtn #menubtn_line span:first-child {
    top: 12px;
}
#menubtn #menubtn_line span:nth-child(2) {
    margin-top: -1px;
    top: 50%;
}
#menubtn #menubtn_line span:last-child {
    bottom: 12px;
}
#menubtn.active #menubtn_line span:first-child {
    -webkit-transform: translateY(7px) rotate(45deg);
    -moz-transform: translateY(7px) rotate(45deg);
    -ms-transform: translateY(7px) rotate(45deg);
    transform: translateY(7px) rotate(45deg);
}
#menubtn.active #menubtn_line span:nth-child(2) {
    opacity: 0;
}
#menubtn.active #menubtn_line span:last-child {
    -webkit-transform: translateY(-7px) rotate(-45deg);
    -moz-transform: translateY(-7px) rotate(-45deg);
    -ms-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
}


/*ヘッダー*/
header { width:1200px; max-width:100%; margin:0 auto; position:relative; padding:50px 15px; display: flex; justify-content: space-between; align-items: flex-end;}
header .logo{font-size: clamp(2rem, 1.5376rem + 1.05vw, 2.8rem); text-align:left; margin-left:20px;}
header .nav_wrap{ width:550px; max-width:100%;}
header ul.nav { display: flex; justify-content: space-between;}
header ul.nav li{ font-size:1.6rem; line-height:1.4rem; padding:5px 12px; font-weight:400;}

#navi_toggle{ width:100%; display:none; background:rgba(255,255,255,0.9); padding:30px; position:absolute; right:0; top:0; z-index:2; box-sizing: border-box;}
#navi_toggle ul{ margin:60px 0 0 0; font-weight: 900;}
#navi_toggle ul li{ font-size:1.4rem; margin:0px 0 30px; padding:3px 5px 2px 3px; text-align:left;}
#navi_toggle ul li span{ padding-left:10px;}


/*フッター*/
#footer_wrap { width:100%; max-width:100%; margin:0 auto; padding:100px 0; background:#F9FAFA;}
footer{ width:1200px; max-width:95%; margin:0 auto; text-align:left; }
footer .left_box{ width:100%; padding:0; margin:0;}
footer .left_box h1.logo{ margin-bottom:30px; font-size: clamp(2rem, 1.6368rem + 1.14vw, 3rem);}
footer ul{ margin:60px 0 ;}
footer ul li{ font-size:1.6rem; line-height:1.6em; padding:7px 0;}
footer :is(.contact_btn , .consultation_btn){ width:200px; background:#003B82; color:#FEFEFE; font-size:1.6rem; line-height:1.4em; padding:10px 10px 10px 50px; position:relative; margin-bottom:10px;}
footer :is(.contact_btn , .consultation_btn) a{ color:#fff;}
footer .contact_btn:before{ content:""; width:25px; height:25px; background:url(../images/icon1.svg) no-repeat; background-size:contain; position:absolute; top:15px; left:15px;}
footer .consultation_btn:before{ content:""; width:25px; height:25px; background:url(../images/icon2.svg) no-repeat; background-size:contain; position:absolute; top:10px; left:15px;}

/*共通*/
h1.title{  font-size:clamp(1.6rem, 1.3552rem + 0.56vw, 1.8rem); line-height:1.6em; letter-spacing:0.05em; margin:100px auto 80px;}
h1.title span{ font-size:clamp(2rem, 1.3056rem + 1.58vw, 3.2rem); color:#003B82; display:block; margin-bottom:5px;}

h1.title2{ font-size:clamp(2rem, 1.3056rem + 1.58vw, 3.2rem); line-height:1.6em; letter-spacing:0.05em; margin:100px auto 80px; text-align:left;}
h1.title2 span{ font-size:clamp(1.6rem, 1.3552rem + 0.56vw, 1.8rem); line-height:1.2em; color:#003B82; display:block; margin-bottom:5px; font-family: "Poppins", sans-serif;}
.col_box{display:flex; justify-content:center; flex-wrap:wrap;}
.more_btn{
	width:180px;
	max-width:100%;
  padding: 12px 40px 12px 20px;
    color: #003B82;
    text-decoration: none;
    outline: none;
	font-size:1.8rem;
    margin:50px 0 20px auto;
	cursor:pointer;
	border:1px solid #003B82;
	position:relative;
	font-family: "Montserrat ", sans-serif;
	text-align:center;
	
}


.more_btn::after{
	content:"→";
	position: absolute;
    top:50%;
    right:20px;
	transform: translate(-50%, -50%);
	transition:0.3s;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight:500;

}


.more_btn:hover::after{
    right:10px;
	 transition:0.3s;
}


.active.fadeup{
	animation-name:fadeUp;
	animation-duration:1s;
	animation-fill-mode:forwards;
	opacity: 0;
	}
.active.fadein{
	animation-name:fadein;
	animation-duration:2s;
	animation-fill-mode:forwards;
	opacity: 0;
	}
.active.slidein{
	animation-name:slidein;
	animation-duration:1s;
	animation-fill-mode:forwards;
	opacity: 0;
	}
@keyframes fadein{
  0% {
    opacity: 0;
	transform: translateY(10px);
  }

  100% {
    opacity: 1;
	transform: translateY(0);
  }
}

@keyframes fadeUp{
  0% {
    opacity: 0;
  transform: translateY(80px);
  animation-timing-function: ease-out;
  }
  100% {
    opacity: 1;
  transform: translateY(0);
  animation-timing-function: ease-out;
  }
}

@keyframes slidein {
  0% {
    transform: translateX(-50px);
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.noimage{ width:320px; max-width:100%; height:250px; font-size:2rem; line-height:1.4em; display:flex; justify-content:center; align-items: center; flex-wrap:wrap;}

/* pagination */
.pagination {
  margin: 30px auto;
  font-size:1.6rem;
}

/* リンクの枠 */
.pagination .nav-links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 8px;
}

 /* 数字のリンク */
.pagination .nav-links .page-numbers {
  text-decoration: none;
  color: #333;
  display: inline-block;
  padding: 0.7em 0.7em;
  margin:0 2px;
  -webkit-transition: .3s;
  transition: .3s;
  border:1px solid #666;
}
.pagination .nav-links .page-numbers.dots{ border:none;}
/* 現在のページ */
.pagination .nav-links .current {
	background:#eee;
}

/* 現在のページとドット以外にホバーした時 */
.pagination .nav-links a:hover {
	border-bottom:1px solid #333;
} 




/*トップページ*/

#top .mainimage{ padding-top:54.285%; background:url(../images/top_mainimage.jpg) no-repeat 40%; background-size:cover; position:relative;}
#top .mainimage {animation-name:fadein;
	animation-duration:2s;
	animation-fill-mode:forwards;
	opacity: 0;
}



#top .mainimage .text_box{position:absolute; top:50%; right:20%; transform: translate(0%, -50%); text-align:left;}
#top .mainimage h1{ font-size:clamp(2rem, 1.1888rem + 1.58vw, 3.4rem); line-height:1.4em; margin-bottom:100px;}
#top .mainimage p{ font-size:clamp(1.4rem, 1.168rem + 0.53vw, 1.8rem); line-height:1.8em;}

#top .sec1{ padding:100px 0;}
:is(#top , #blog_list)  ul.info_list { width:750px; max-width:90%; margin:50px auto;}
:is(#top , #blog_list) ul.info_list li{ letter-spacing:0.05em; font-size: clamp(1.4rem, calc(1.2rem + 0.625vw), 1.6rem); display:flex; justify-content:left; flex-wrap:wrap; border-bottom:1px solid #DCDCDD; padding:10px;}
:is(#top , #blog_list) ul.info_list li .category { font-size:1.2rem; line-height:1.8em; width:84px; height:24px; margin-right:20px; border-radius: 12px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -moz-border-radius: 12px; }
:is(#top , #blog_list) ul.info_list li .category.blog { background:#F1CF9A;}
:is(#top , #blog_list) ul.info_list li .category.news { background:#C4D9F0;}
:is(#top , #blog_list) ul.info_list li p span { display:inline-block; margin-right:15px;}
:is(#top , #blog_list) ul.info_list li p{ width:calc(100% - 105px); margin:0;}
#top .sec1 .more_btn{ margin:10px auto;}


#top .sec2 .title_image{ width:1400px; max-width:100%; margin:0 auto; background:#003B82; display:flex; justify-content:center; flex-wrap:wrap; align-items: center;}
#top .sec2 .title_image .photo{ width:650px; max-width:50%;}
#top .sec2 .title_image h1{ font-size:clamp(2.0rem, 1.4672rem + 1.11vw, 2.8rem);text-align:center; color:#FEFEFE;}
#top .sec2 .title_image h1 span{ font-size:clamp(1.6rem, 1.3552rem + 0.56vw, 1.8rem); color:#FEFEFE; margin:0;}

#top .sec2 .col_box{ align-items:center;}
#top .sec2 h2{ font-size: clamp(2.4rem, calc(2.2rem + 1.2vw), 3.8rem); line-height:1.2em; color:#B4B5B5; text-align:left; padding:10px 10px 8px 25px; margin:20px 0; border-bottom:1px solid #B4B5B5;}
#top .sec2 p{ padding:10px 20px;}
#top .sec2 dl{ width:650px; max-width:100%; padding:20px 0; display:flex; justify-content: space-between; flex-wrap:wrap; align-items:center; font-size:1.6rem; line-height:1.6em; margin:0 auto;}
#top .sec2 dl dt{ width:100px; padding:5px 10px; background:#003B82; color:#FEFEFE; margin:0 20px 10px 0;}
#top .sec2 dl dd{ width:calc(100% - 120px); margin:0 0px 10px 0; text-align:left;}
#top .sec2 .left_box{ width:800px; max-width:60%; padding:50px;}
#top .sec2 .right_box{ width:600px; max-width:40%;}

#top .sec3{ background:#F9FAFA; padding:10px 0;}
#top .sec3 .service_list{ width:1100px; margin:0 auto; max-width:100%; display:flex; justify-content:left; flex-wrap:wrap;}
#top .sec3 .service_box{ width:550px; padding:30px; max-width:47%; background:#FEFEFE; margin:10px;}
#top .sec3 .service_box h2{font-size:clamp(1.8rem, 1.4528rem + 0.79vw, 2.4rem); line-height:1.4em; position:relative; padding:20px 20px 20px 80px; text-align:left;}
#top .sec3 .service_box h2:before{ content:""; width:65px; height:65px; position:absolute; left:0; top:0;}
#top .sec3 .service_box:nth-of-type(1) h2:before{ background:url(../images/top_icon1.png) no-repeat; background-size:cover;}
#top .sec3 .service_box:nth-of-type(2) h2:before{ background:url(../images/top_icon2.png) no-repeat; background-size:cover;}
#top .sec3 .service_box:nth-of-type(3) h2:before{ background:url(../images/top_icon3.png) no-repeat; background-size:cover;}
#top .sec3 .service_box:nth-of-type(4) h2:before{ background:url(../images/top_icon4.png) no-repeat; background-size:cover;}
#top .sec3 .service_box:nth-of-type(5) h2:before{ background:url(../images/top_icon5.png) no-repeat; background-size:cover;}
#top .sec3 .service_box:nth-of-type(6) h2:before{ background:url(../images/top_icon6.png) no-repeat; background-size:cover;}
#top .sec3 .service_box p{ padding:5px;}


#top .sec4 .blog_list{ width:1100px; margin:0 auto; max-width:100%; display:flex; justify-content:left; flex-wrap:wrap;}
#top .sec4 .blog_box{ width:340px; max-width:31%; margin:1%; border:1px solid #C9C9CA;}
#top .sec4 .blog_box h2{ font-size:clamp(1.6rem, 1.368rem + 0.53vw, 2rem); width:90%; margin:20px auto;}
#top .sec4 .blog_box p{ font-size:1.4rem; line-height:1.6em; width:90%; margin:10px auto 20px;}


#top .sec5 h1.title{ margin:200px auto;}
#top .sec5 .col_box{ background:#EAF3F9;}
#top .sec5 .photo img{ width:400px; height:400px; border-radius:200px; -webkit-border-radius:200px; -moz-border-radius:200px; -moz-border-radius:200px; margin-top:-80px;}
#top .sec5 .text_box{ width:620px; padding:50px; max-width:90%; text-align:left;}
#top .sec5 .text_box h2{ font-size: clamp(2rem, 1.6368rem + 1.14vw, 3rem); line-height:1.4em; margin:60px 0 100px;}
#top .sec5 .text_box p{ margin:15px auto;}
#top .sec5 .text_box span.name{ display:block; margin:30px 0; text-align:right;}

#top .sec6 .col_box{ width:1100px; max-width:100%; margin:200px auto; justify-content: space-between;}
#top :is(.contact_box , .consultation_box){width:520px; max-width:49%; padding:30px 40px 20px 40px;}
#top .contact_box{  background:#003B82; color:#FEFEFE;}
#top .contact_box h1{ color:#FEFEFE;}
#top .contact_box .more_btn{ border:1px solid #FEFEFE; color:#FEFEFE;}
#top .contact_box .more_btn:before{ color:#FEFEFE;}
#top :is(.contact_box , .consultation_box) h1{ margin:0px auto 10px; font-size:clamp(2.2rem, 1.5056rem + 1.58vw, 3.4rem); letter-spacing:0.05em; text-align:left; font-weight:500;}
#top :is(.contact_box , .consultation_box) h1 span{ font-size:clamp(1.6rem, 1.368rem + 0.53vw, 2rem); display:block; margin-bottom:10px;}
#top :is(.contact_box , .consultation_box) p{ font-size:1.4rem;}
#top :is(.contact_box , .consultation_box) .more_btn{ margin-top:30px;}
#top .consultation_box{ background:#F9FAFA; color:#003B82;}

#profile .mainimage{ padding-top:40%; background:url(../images/profile_mainimage.jpg) no-repeat 40%; background-size:cover; position:relative;}
#profile .mainimage .text_box{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
#profile .mainimage h1 span{ font-size:clamp(2rem, 1.1888rem + 1.58vw, 3.4rem); line-height:1.2em; color:#3C3D3E; }
#profile .mainimage h1 {  font-size:clamp(1.6rem, 1.368rem + 0.53vw, 2rem); line-height:1.2em; text-align:center;}

#profile :is(.sec1 , .sec2 , .sec3 , .sec4){ width:1200px; max-width:90%; margin:100px auto;}
#profile h1{ font-size:clamp(2.2rem, 1.5056rem + 1.58vw, 3.4rem); line-height:1.4em; margin:40px auto 60px; text-align:left;}
#profile p{ padding:10px 0;}
#profile span.name{ display:block; margin:20px 0; text-align:right;}
#profile .en_title{ font-family: "Poppins", sans-serif; font-weight:600; font-size:clamp(3.6rem, 1.5632rem + 6.36vw, 9.2rem); line-height:1em; color:#EEEFEF; text-align:right; transform: translate(0%, -60%);}
#profile .sec1 .right_box{ width:305px; }
#profile .sec1 .left_box{ width:calc(100% - 305px); z-index:1; position:relative;}
#profile .sec2 .right_box{ width:550px; max-width:40%;}
#profile .sec2 .left_box{ width:600px; max-width:60%; padding-right:30px; z-index:1; position:relative;}
#profile .sec3 .right_box{ width:calc(100% - 300px); padding-left:30px;}
#profile .sec3 .left_box{ width:300px; max-width:100%;}

#profile .sec4 dl{ width:980px; max-width:100%; font-size: clamp(1.4rem, calc(1.2rem + 0.625vw), 1.6rem); line-height:2em; display:flex; justify-content:left; flex-wrap:wrap;}
#profile .sec4 dt{ text-align:center; padding:20px 10px; width:140px; border-bottom:1px solid #003B82;}
#profile .sec4 dd{ text-align:left; padding:20px 20px; width:calc(100% - 140px); border-bottom:1px solid #C9C9CA;}
#profile .sec4 p{ font-size: clamp(1.4rem, calc(1.2rem + 0.625vw), 1.6rem); }


:is(#blog , #blog_list){ width:1260px; margin:0 auto 100px; max-width:95%;}
:is(#blog , #blog_list) .left_box{ width:940px; max-width:calc(100% - 260px); margin-right:20px; margin-bottom:50px;}
:is(#blog , #blog_list) .right_box{ width:240px; margin-bottom:50px;}
#blog .left_box article{ width:90%; margin:0 auto;}
#blog .left_box h1{  background:#F9F9F9;  font-size:clamp(2.0rem, 1.4672rem + 1.11vw, 2.8rem); line-height:1.4em; padding:15px 25px; text-align:left; margin-bottom:10px;}
#blog .left_box p{ width:90%; margin:10px auto; letter-spacing:0.05em;}
#blog .left_box .image{ margin:0px auto 30px;}
#blog .left_box ul{ text-align:right; margin-bottom:20px;}
#blog .left_box ul.cate li{ color:#666; display:inline-block; border:1px solid #999; padding:4px 10px; margin:0 5px; font-size:1.4rem; line-height:1.2em;}
#blog .left_box ul.cate li a{ color:#666666; }
#blog .left_box p.date{ font-size:1.4rem; line-height:1.2em; text-align:right; margin:10px 0;}
:is(#blog , #blog_list) .right_box h1{ background:#003B82; color:#fff; padding:5px 10px;}
:is(#blog , #blog_list) .right_box ul{ margin:20px 0; text-align:left;}
:is(#blog , #blog_list) .right_box ul.cate li{ border:1px solid #003B82; padding:10px; margin-bottom:10px; letter-spacing:0.1em; position: relative; padding-left:20px;}
:is(#blog , #blog_list) .right_box ul.cate li::before,
:is(#blog , #blog_list) .right_box ul.cate li::after {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  right: 10px;
  width: 13px;
  height: 2px;
  border-radius: 9999px;
  background-color: #000000;
  transform-origin: calc(100% - 1px) 50%;
}

:is(#blog , #blog_list) .right_box ul.cate li::before {
  transform: rotate(45deg);
}

:is(#blog , #blog_list) .right_box ul.cate li::after {
  transform: rotate(-45deg);
}


:is(#blog , #blog_list) .right_box ul li{ font-size:1.6rem; line-height:1.4em; padding:5px;}
:is(#blog , #blog_list) .right_box ul.tag li{ display:inline-block; padding:3px 7px; color:#666;}
:is(#blog , #blog_list) .right_box .popular li{ font-size:1.6rem; text-align:left; padding:5px;}

#blog_list .left_box  .col_box{ justify-content:left; }
#blog_list .left_box  .blog_box{ width:300px; max-width:31%; margin:1%; border:1px solid #CCC; text-align:left; display:flex; flex-direction:column;}
:is(#top , #blog_list) .img_box{ width:100%; padding-top:66%; background-size:cover; background-position:center center;}


#blog_list .left_box  .text{ padding:10px 20px 20px;}
#blog_list .left_box  .text p{ font-size:1.4rem; line-height:1.6em;}
#blog_list .left_box .cate{ margin:5px 5px 5px 0; letter-spacing:0.1em; border:1px solid #003B82; padding:5px 15px; font-size:1.4rem; line-height:1.2em; display:inline-block; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px;}
#blog_list .left_box  h1{ font-size:2rem; margin:10px 0;}
#blog_list .left_box  ul.tag{ margin:20px auto;}
#blog_list .left_box  ul.tag li{ font-size:1.4rem; display:inline-block; padding:3px 7px; color:#666;}
#blog_list.blog_taxonomy h1.title{ margin-bottom:50px;}
#blog_list.blog_taxonomy h2.title{ width:1200px; max-width:90%; margin:0 auto 50px;  font-size:clamp(1.6rem, 1.368rem + 0.53vw, 2rem); text-align:left; padding-left:10px; border-left:3px solid #003B82;}


#privacy { width:800px; max-width:90%; margin:60px auto; counter-reset: listnum;}
#privacy p{ padding:10px 15px;}
#privacy p.name{ text-align:right;}
#privacy h2{ max-width:100%;  text-align:left; font-size:clamp(1.8rem, 1.568rem + 0.53vw, 2.2rem); line-height:1.4em; margin:50px auto 20px; color:#003B82;}
#privacy h2::before{ counter-increment: listnum; content: counter(listnum); margin-right:10px;}
#privacy h3{ max-width:100%;  font-size:clamp(1.6rem, 1.3552rem + 0.56vw, 1.8rem); font-weight:500; line-height:1.6em; text-align:left; margin:50px auto 20px; padding-left:13px; position:relative;}
#privacy h3:before{ content:""; width:3px; height:30px; background:#003B82; position:absolute; top:0px; left:0;}
#privacy ul{ margin:30px 15px;}
#privacy ul li{ font-size:1.6rem; line-height:1.6em; list-style-type:katakana; margin:10px 0 10px 30px; text-align:left;}


/*#privacy ul li{ font-size:1.6rem; line-height:1.6em; position:relative; padding-left:20px; margin-bottom:20px; text-align:left;}
#privacy ul li:before{ content:""; width:8px; height:8px; background:#B4B5B5; position:absolute; top:10px; left:0;}
*/



:is(#contact , #thanks) .sec1{ width:1000px; max-width:90%; margin:60px auto 100px; font-size:1.6rem; line-height:1.6em;}
#contact p{ text-align:center;}

#contact dl{ width:900px; max-width:100%; margin:50px auto; display:flex; justify-content: space-between; flex-wrap:wrap; text-align:left;}
#contact dl dt{ width:280px; padding:20px 10px 20px 20px; border-bottom:1px solid #CCC;}
#contact dl dd{ width:calc(100% - 280px); padding:20px 20px 20px 10px; border-bottom:1px solid #CCC;}
#contact dl dd input,#contact dl dd textarea,#contact dl dd select{ background:#F7F7F5; padding:15px 10px; width:100%; border:none; font-size:1.6rem; line-height:1.4em;}
#contact dl dd.radio input{ width:auto;}
#contact dl dt span.must{ background:#003B82; color:#fff; font-size:1.4rem; padding:5px 10px; margin-right:10px;}
#contact dl dt span.nomust{ background:#CCCCCC; color:#000; font-size:1.4rem; padding:5px 10px; margin-right:10px;}
#contact .privacy_check{ width:100%; margin:20px auto 40px; text-align:center;}
#contact .privacy_check a{ text-decoration:underline;}
#contact p.check{ text-align:center; margin:40px auto;}
/*:is(#contact , #thanks) .step_wrap{ width:900px; max-width:100%; margin:0 auto; display:flex; justify-content:left; flex-wrap:wrap; border:1px solid #eae7db;}
:is(#contact , #thanks) .step_wrap div{ width:33.3%; padding:10px; font-size:1.6rem; line-height:1.4em; border-right:1px solid #eae7db;}
:is(#contact , #thanks) .step_wrap div:last-child{ border:none;}
:is(#contact , #thanks) .step_wrap div.act{ background: #F7F7F5;}
*/#thanks p{ width:800px; max-width:100%; padding:50px 0; line-height:2em;}
#thanks h1.title{line-height:1.8em; }

#contact .btn_wrap{ width:550px; max-width:100%; margin:0 auto; display:flex; justify-content:center; flex-wrap:wrap;}
#contact .back_btn,#contact .send_btn,#contact .confirm_btn{width:180px; margin:10px 20px;}
#contact .confirm_btn{ margin:10px auto;}
#contact .back_btn input{ width:180px; background:#ccc; padding:15px; border:none; font-size:1.6rem; line-height:1.6em;  color:#fff;}
#contact .back_btn input:hover{ background:#666666;}
#contact .send_btn input,#contact .confirm_btn input{ width:180px; display:block; background:#797974; padding:15px; border:none; font-size:1.6rem; line-height:1.6em;  color:#fff; cursor:pointer; }
#contact .send_btn input:hover ,#contact .confirm_btn input:hover{ background:#333333;}




@media screen and (max-width: 1100px){
#blog_list .left_box  .blog_box{ width:auto; max-width:48%; margin:1%;}

}


@media screen and (max-width: 960px){
header .nav_wrap{ display:none;}
header #menubtn{ display:block;}
header { padding:65px 15px 15px;}

}
@media screen and (max-width: 900px){
#top .mainimage .text_box{ top:50%; right:8%;}
#top .mainimage .text_box h1{ margin-bottom:50px;}
#top .sec1{ padding-top:30px;}
#top .sec2 .col_box{ display:block;}
#top .sec2 .col_box .left_box{ max-width:90%; margin:30px auto 0; padding:0px;}
#top .sec2 .col_box .right_box{ max-width:95%; margin:0 auto;}

:is(#blog , #blog_list)>.col_box{ display:block;}
:is(#blog , #blog_list)  .left_box{ width:100%; max-width:100%; margin-right:0px;}
:is(#blog , #blog_list)  .right_box{ width:300px; max-width:calc(100% - 60px); margin:30px auto 30px 30px;}

}
@media screen and (max-width: 800px){
#profile :is(.sec1 , .sec2 , .sec3 , .sec4){ margin:30px auto;}
#profile .sec4{ margin-bottom:100px;}
#profile :is(.sec1 , .sec2 , .sec3) .col_box{ display:block;}
#profile .sec1 .right_box{ width:100%; }
#profile .sec1 .right_box img{ width:305px; max-width:50%; }
#profile .sec1 .left_box{ width:100%; padding:30px 0;}
#profile .sec2 .right_box{ width:100%; max-width:100%;}
#profile .sec2 .left_box{ width:100%; max-width:100%; padding:30px 0px;}
#profile .sec3 .right_box{ width:100%; padding:30px 0px;}
#profile .sec3 .left_box{ width:260px; margin:0 auto; }


}
/*767以下 ipadを含まない*/
@media screen and (max-width: 767px){
.spno{ display:none;}
#top .sec3 .service_list{  display:block; }
#top .sec3 .service_box{ width:90%; padding:30px; max-width:90%; margin:0px auto 20px;}

}

@media screen and (max-width: 660px){
#top .sec2 .title_image{ display:block; padding:10px 0 0px;}
#top .sec2 .title_image .photo{ width:auto; margin:0 auto; max-width:100%;}
#top .sec2 .title_image h1{ margin:40px auto;}

#top .mainimage{ padding-top:80%; }
#top .mainimage .text_box{ width:57%; right:auto; left:40%;}
#top .mainimage .text_box h1{ margin-bottom:20px;}
#top .mainimage .text_box p br{ display:none;}
#top .mainimage p{ line-height:1.6em;}

#top .sec1 h1{ margin:50px auto;}

#top .sec4 .blog_list{  max-width:100%; display:block;}
#top .sec4 .blog_box{ width:440px; max-width:95%; margin:10px auto;}

#profile .sec4 dt{width:20%;}
#profile .sec4 dd{width:80%;}

}


/*600以下 */
@media screen and (max-width: 600px){

#top .sec5 .text_box{ padding:10px; max-width:90%;}
#top .sec6 .col_box{  margin:100px auto; display:block;}
#top :is(.contact_box , .consultation_box){width:520px; max-width:95%; padding:20px 30px 10px 30px; margin:10px auto;}

#contact dl{ display:block; }
#contact dl dt{ width:100%; padding:20px 20px 5px;}
#contact dl dd{ width:100%; padding:20px; }

#footer_wrap{ padding:60px 30px;}

footer .left_box{ width:100%; padding:0; margin:0 auto;}
footer .logo{max-width:100%;}

}

/*560以下 */
@media screen and (max-width: 560px){
header .logo{ text-align:left; margin:10px 0 0px 0px;}

#profile .sec4 dl{ line-height:1.6em; display:block;}
#profile .sec4 dt{ text-align:left; padding:20px 20px 5px; width:100%; border-bottom:1px solid #003B82;}
#profile .sec4 dd{ text-align:left; padding:10px 20px; width:100%; border-bottom:1px solid #C9C9CA;}

#profile .sec4 dt:first-child{ display:none;}

#blog_list .left_box  .blog_box{ width:auto; max-width:95%; margin:10px auto;}
#blog_list.blog_taxonomy h2.title{  margin:0 auto 20px; }


/*グーぐるマップ*/
.gmap {
position: relative;
width:480px;
padding-bottom: 70%;
height: 0;
overflow: hidden;
max-width:100%;
margin:0 auto;
border:1px solid #CCCCCC;
}
 
.gmap iframe,
.gmap object,
.gmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
	
}
/*414以下 iphone縦*/
@media screen and (max-width: 414px){
#top .sec2 dl{ display:block;}
#top .sec2 dl dt{ width:100px; padding:5px 10px; background:#003B82; color:#FEFEFE; margin:0 20px 10px 0;}
#top .sec2 dl dd{ width:100%; margin:0 0px 10px 0; text-align:left;}

#top .mainimage{ padding-top:120%; background:url(../images/top_mainimage.jpg) no-repeat 30%; background-size:cover;}
#top .mainimage .text_box{ width:57%; right:auto; left:40%;}
#top .mainimage .text_box h1{ margin-bottom:20px;}
#top .mainimage .text_box p br{ display:none;}
#top .mainimage p{ line-height:1.6em;}

#top .sec3 .service_box{ padding:15px;}
#top .sec3 .service_box .more_btn { margin-top:30px;}
#top .sec5 .photo img{ width:80%; height:auto; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -moz-border-radius:50%; margin-top:-80px;}
#top .sec5 .text_box h2{ margin:40px auto;}
#top .sec5 .text_box h2 br{ display:none;}


:is(#top , #blog_list) ul.info_list li{ display:block; }
:is(#top , #blog_list) ul.info_list li p{ width:100%; margin-top:10px;}



#profile h1{ margin:20px auto 30px;}

.spno2{ display:none;}






}