@charset "utf-8";
/*
	Theme Name: hanairolab
	Description: はないろlabのサイトです。
	Theme URI: https://hanairolab.com/
	Author: hanairolab.com
	Author URI: https://hanairolab.com/
	License: GNU General Public License
	License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/


@media screen and (min-width: 761px) {


body,p,div,ul,li,h1,h2,h3,h4,h5 { margin: 0; padding: 0; -webkit-text-size-adjust: 100%;}
li { display:inline; float:left; list-style: none ; }
a img{ border:none; }
a:hover img { opacity:0.8; filter: alpha(opacity=80); -ms-filter: "alpha( opacity=80 )"; }
a:link { color: #000000 ; text-decoration: none ;}
a:hover { color: #000000 ; text-decoraiton: none ; opacity:0.6; filter: alpha(opacity=60); -ms-filter: "alpha( opacity=60 )";}
a:visited { color: #000000 ; text-decoration: none;}
a:active { color: #000000 ; text-decoration: none;}
table { border-top: 0px #666666 solid; border-left: 0px #666666 solid; }
td { border-right: 0px #666666 solid; border-bottom: 0px #666666 solid; font-family: 'M PLUS Rounded 1c', sans-serif; font-size: 14px; line-height: 20px;}
p { font-size: 26px; font-family: 'M PLUS Rounded 1c', sans-serif; line-height: 40px; color:#000000; }
p.resizeimage img { width: 100%; text-align:center; }
hr { border-width: 3px 0px 0px 0px; border-style: dotted ; border-color: #000000; height: 1px; }
.pc_no { display: none; }

h1 { font-family: 'M PLUS Rounded 1c', sans-serif; }
h2 { font-family: 'M PLUS Rounded 1c', sans-serif; }
h3 { font-family: 'M PLUS Rounded 1c', sans-serif; color: #D86C00; font-size: 33px; line-height: 40px;}

.style01 { color:#D86C00; font-weight: bold;}
.style02 { color:#12A443; font-weight: bold;}
.style03 { font-size: 33px; font-weight: bold; margin-bottom:20px;}
.style04 { font-size: 33px; }
.style05 { color:#12A443; font-weight: bold; font-size: 20px;}

.style_400 { width:400px;}
.style_260 { width:300px;}

.pic100 { width:100%;}

.backtotop { position: fixed; right: 15px; bottom: 210px; z-index: 9000; display: none; }    
.backtotop a { display: block; color: #ffffff; padding: 20px 10px; margin: 0; background-color: #5691BD; border-radius: 5px; text-decoration: none; font-size: 12px; font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: bold;}
.backtotop a:hover { background: #CAE0F0; color: #327AAF;}

.menu-btn {
    position: fixed;
    top: 40px;
    left: 20px;
    display: flex;
    height: 78px;
    width: 70px;
    justify-content: center;
    align-items: center;
    z-index: 90;
	color: #2D70A2;
	font-size:18px;
	font-weight:bold;
	background-color: #ffffff;
	border: 3px solid #2D70A2;
	border-radius: 10px;
	font-family: 'M PLUS Rounded 1c', sans-serif;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
    content: '';
    display: block;
    height: 3px;
    width: 25px;
    border-radius: 3px;
    background-color: #2D70A2;
    position: absolute;
	top: 16px;
}
.menu-btn span:before {
    bottom: 8px;
}
.menu-btn span:after {
    top: 8px;
}
#menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);
}
#menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
}
#menu-btn-check {
    display: none;
}
.menu-content ul {
    padding: 70px 30px ;
}
.menu-content ul li {
    border-bottom: solid 1px #2D70A2;
    list-style: none;
	width: 100%;
	margin-top: 40px;
}
.menu-content ul li a {
    display: block;
    width: 100%;
    font-size: 23px;
    box-sizing: border-box;
    color:#2D70A2;
    text-decoration: none;
    padding: 5px 15px 10px 0;
    position: relative;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: bold;
}
.menu-content ul li a::before {
    content: "";
    width: 7px;
    height: 7px;
    border-top: solid 2px #2D70A2;
    border-right: solid 2px #2D70A2;
    transform: rotate(45deg);
    position: absolute;
    right: 11px;
    top: 16px;
}
.menu-content {
    width: 20%;
	min-width:320px;
    height: 100%;
    position: fixed;
    top: 0;
    right: 100%;
    z-index: 80;
    background-color: #ffffff;
    transition: all 0.5s;/*アニメーション設定*/
}
#menu-btn-check:checked ~ .menu-content {
    left: 0;/*メニューを画面内へ*/
}

html,body { text-align: center ; margin: 0 auto ; }

#outline { width: 100% ; min-width:1200px; text-align: center ; margin: 0 auto ; inline-block; clear: both; bottom:0;}
.header01 { width: 13%; min-width:220px; position: fixed; right:20px; top:40px;}
.header02 { width: 23%; min-width:380px; position: absolute; left:120px; top:40px;}

#home_h { width: 100% ; min-width:1200px; text-align: center ; }
#home_h_sp { display: none;}
#sub_h { width: 100% ; min-width:1200px; text-align: center ; margin: 100px 0 20px 0 ; }
#sub_h_sp { display: none;}

#outline01 { width:100%; min-width:1200px; text-align: center ; background-color: #FFF8DF; display: inline-block; clear: both; bottom:0;}
.home01 { width: 1100px ; text-align: center ; margin: 0 auto ;}
.home01_text01 { width: 1100px ; text-align: center ; margin-top: 80px ; float:left; }
.home01_text02 { width: 1100px ; text-align: left ; float:left; }
.home01_text02_l { width: 160px ; height:50px; text-align: center ; float:left; }
.home01_text02_r { width: 940px ; height:50px; text-align: left ; float:left; }
.home01_text02_c { width: 1100px ; height:35px; text-align: left ; float:left; }

#outline02 { width:100%; min-width:1200px; text-align: center ; background-color: #EFF5EB; display: inline-block; clear: both; bottom:0;}
.home02 { width: 1100px ; text-align: center ; margin: 0 auto ;}
.home02_text01 { width: 1100px ; text-align: center ; margin-top: 80px ; float:left; }
.home02_text02 { width: 1100px ; text-align: left ; float:left; }
.home02_text02_l { width: 160px ; height:50px; text-align: center ; float:left; }
.home02_text02_r { width: 940px ; height:50px; text-align: left ; float:left; }
.home02_text02_c { width: 1100px ; height:35px; text-align: left ; float:left; }

#outline03 { width:100%; min-width:1200px; text-align: center ; background-color: #FFEAEA; display: inline-block; clear: both; bottom:0;}
.home03 { width: 1100px ; text-align: center ; margin: 0 auto ;}
.home03_text01 { width: 1100px ; text-align: center ; margin-top: 80px ; float:left; }
.home03_text02 { width: 1100px ; text-align: left ; float:left; }
.home03_text02_r { width: 1100px ; height:50px; text-align: left ; float:left; }
.home03_text02_c { width: 1100px ; height:35px; text-align: left ; float:left; }

#outline04 { width:100%; min-width:1200px; text-align: center ; display: inline-block; clear: both; bottom:0;}
.home04 { width: 1100px ; text-align: center ; margin: 0 auto ;}
.home04_text01 { width: 1100px ; text-align: center ; margin-top: 80px ; float:left; }
.home04_text02 { width: 1100px ; text-align: left ; float:left; }
.home04_text02_r { width: 1100px ; text-align: left ; float:left; background-image: url("images/line_bg01.png") ;}
.home04_text02_r p { line-height: 91px; margin-top:1px; }
.home04_text03_l { width: 300px ; text-align: left ; float:left; }
.home04_text03_r { width: 700px ; text-align: left ; float:right; }

.home04_text01_sub { width: 1100px ; text-align: center ; float:left; }
.home04_text02_sub { width: 1100px ; text-align: left ; float:left; }
.home04_text02_sub_l { width: 1100px ; text-align: left ; float:left; margin-top:70px;}
.home04_text02_sub_r { width: 1100px ; text-align: right ; float:left; margin-top:70px;}
.aboutus01 { width: 1100px ; text-align: left ; float:left; background-image: url("images/aboutus_bg01.png") ; border-radius: 12px;}
.aboutus02 { width: 1000px ; text-align: left ; float:left; margin: 10px 50px 20px 50px; }
.aboutus02 p { line-height: 90px; margin-top:1px; }

#outline05 { width:100%; min-width:1200px; text-align: center ; background-color: #F0F0FF; display: inline-block; clear: both; bottom:0;}
.home05 { width: 1100px ; text-align: center ; margin: 0 auto ;}
.home05_text01 { width: 1100px ; text-align: center ; margin-top: 80px ; float:left; }
.home05_text01_sub { width: 1100px ; text-align: center ; float:left; }
.home05_text02 { width: 1100px ; text-align: left ; float:left; }
.home05_text03 { width: 1100px ; margin-top:70px; text-align: left ; float:left; }
.home05_text02_q1 { width: 1100px ; text-align: left ; float:left; background:rgba(255,255,255,0.9); border-radius: 12px 12px 0 0 ;}
.home05_text02_q2 { width: 1050px ; margin:25px; text-align: left ; float:left; }
.home05_text02_q2 p { color:#D86C00; }
.home05_text02_a1 { width: 1100px ; text-align: left ; float:left; background:rgba(255,255,255,0.4); border-radius: 0 0 12px 12px;}
.home05_text02_a2 { width: 1000px ; margin:50px; text-align: left ; float:left; }

.outline_space01 { width: 100% ; height:80px ; text-align: center ; clear: both; bottom:0;}

.news01 { width: 1100px ; text-align: left ; float:left; background-color: #EAF1F7 ; border-radius: 12px;}
.news02 { width: 1000px ; text-align: left ; float:left; margin: 40px 50px 40px 50px; line-height: 40px; font-size: 26px; font-family: 'M PLUS Rounded 1c', sans-serif;}
	
.contact01 { width: 1100px ; text-align: left ; float:left; background-color: #EAF1F7 ; border-radius: 12px;}
.contact02 { width: 1000px ; text-align: center ; float:left; margin: 10px 50px 20px 50px; }
.wpcf7 span.wpcf7-not-valid-tip { color: #D86C00; font-size: 20px;}
.wpcf7-response-output { color: #D86C00; font-size: 20px;}
input { font-size: 26px;}
textarea { font-size: 26px; width: 440px ;}
input[type="submit"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  font-size: 20px;
  font-weight: bold;
  width: 200px;
  height: 50px;
  border-radius: 10px;
  background-color: #5691BD;
  border: none;
  color: #fff;
  cursor: pointer;
}
span.wpcf7-spinner {
  display: none;
}

#footer { width: 100% ; float:left; margin: 0 auto ; background-image: url("images/bg.png") ;  background-position: center top; clear: both; bottom:0;}
.footer01 { width: 1100px ; text-align: center ; margin: 0 auto ;}
.footer01_text01 { width: 1100px ; text-align: left ; margin-top: 80px ; float:left;}
.footer01_text02 { width: 1100px ; text-align: left ; margin: 120px 0 50px 0 ; float:left; }
.footer01_text02_sub { width: 1100px ; text-align: left ; margin: 80px 0 50px 0 ; float:left; }
.footer01_text02_l { width: 220px ; text-align: left ; float:left; }
.footer01_text02_c { width: 380px ; text-align: left ; float:left; }
.footer01_text02_r { width: 500px ; text-align: right ; float:left; }
.footer01_text02_r_sp { display:none; }
.footer01_text03 { width: 100% ; text-align: center ; float:left; margin-bottom:50px; }

}



@media screen and (max-width: 760px) {

body,p,div,ul,li,h1,h2,h3,h4,h5 { margin: 0; padding: 0; -webkit-text-size-adjust: 100%; }
li { display:inline; float:left; list-style: none ; }
a img{ border:none; }
a:hover img { opacity:0.8; filter: alpha(opacity=80); -ms-filter: "alpha( opacity=80 )"; }
a:link { color: #000000 ; text-decoration: none ;}
a:hover { color: #000000 ; text-decoraiton: none ; opacity:0.6; filter: alpha(opacity=60); -ms-filter: "alpha( opacity=60 )";}
a:visited { color: #000000 ; text-decoration: none;}
a:active { color: #000000 ; text-decoration: none;}
table { border-top: 0px #666666 solid; border-left: 0px #666666 solid; }
td { border-right: 0px #666666 solid; border-bottom: 0px #666666 solid; font-family: 'M PLUS Rounded 1c', sans-serif; font-size: 14px; line-height: 20px;}
p { font-size: 24px; font-family: 'M PLUS Rounded 1c', sans-serif; line-height: 40px; color:#000000; }
p.resizeimage img { width: 100%; text-align:center; }
hr { border-width: 3px 0px 0px 0px; border-style: dotted ; border-color: #000000; height: 1px; }
.sp_no { display: none; }
.sp_center { text-align: center ; }


h1 { font-family: 'M PLUS Rounded 1c', sans-serif; }
h2 { font-family: 'M PLUS Rounded 1c', sans-serif; }
h3 { font-family: 'M PLUS Rounded 1c', sans-serif; color: #D86C00; font-size: 33px; line-height: 40px;}

.style01 { color:#D86C00; font-weight: bold;}
.style02 { color:#12A443; font-weight: bold;}
.style03 { font-size: 33px; font-weight: bold; margin-bottom:20px;}
.style04 { font-size: 33px; }
.style05 { color:#12A443; font-weight: bold; font-size: 18px;}
	
.style_400 { width:400px;}
.style_260 { width:260px;}

.pic100 { width:100%;}
.pic380 { width:280px;}
.pic440 { width:310px;}
.pic520 { width:360px;}
.pic460 { width:460px;}

.backtotop { position: fixed; right: 15px; bottom: 210px; z-index: 9000; display: none; }    
.backtotop a { display: block; color: #ffffff; padding: 20px 10px; margin: 0; background-color: #5691BD; border-radius: 5px; text-decoration: none; font-size: 12px; font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: bold;}
.backtotop a:hover { background: #CAE0F0; color: #327AAF;}

.menu-btn {
    position: fixed;
    top: 40px;
    left: 20px;
    display: flex;
    height: 78px;
    width: 70px;
    justify-content: center;
    align-items: center;
    z-index: 90;
	color: #2D70A2;
	font-size:18px;
	font-weight:bold;
	background-color: #ffffff;
	border: 3px solid #2D70A2;
	border-radius: 10px;
	font-family: 'M PLUS Rounded 1c', sans-serif;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
    content: '';
    display: block;
    height: 3px;
    width: 25px;
    border-radius: 3px;
    background-color: #2D70A2;
    position: absolute;
	top: 16px;
}
.menu-btn span:before {
    bottom: 8px;
}
.menu-btn span:after {
    top: 8px;
}
#menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);
}
#menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
}
#menu-btn-check {
    display: none;
}
.menu-content ul {
    padding: 70px 30px ;
}
.menu-content ul li {
    border-bottom: solid 1px #2D70A2;
    list-style: none;
	width: 100%;
	margin-top: 40px;
}
.menu-content ul li a {
    display: block;
    width: 100%;
    font-size: 21px;
    box-sizing: border-box;
    color:#2D70A2;
    text-decoration: none;
    padding: 5px 15px 10px 0;
    position: relative;
	font-weight:bold;
	font-family: 'M PLUS Rounded 1c', sans-serif;
}
.menu-content ul li a::before {
    content: "";
    width: 7px;
    height: 7px;
    border-top: solid 2px #2D70A2;
    border-right: solid 2px #2D70A2;
    transform: rotate(45deg);
    position: absolute;
    right: 11px;
    top: 16px;
}
.menu-content {
    width: 20%;
	min-width:320px;
    height: 100%;
    position: fixed;
    top: 0;
    right: 100%;
    z-index: 80;
    background-color: #ffffff;
    transition: all 0.5s;/*アニメーション設定*/
}
#menu-btn-check:checked ~ .menu-content {
    left: 0;/*メニューを画面内へ*/
}

html,body { text-align: center ; margin: 0 auto ; }

#outline { width: 100% ; text-align: center ; margin: 0 auto ; inline-block; clear: both; bottom:0;}
.header01 { width: 13%; min-width:220px; position: fixed; right:20px; top:40px;}
.header02 { width: 23%; min-width:340px; position: absolute; left:120px; top:40px;}

#home_h { display: none; }
#home_h_sp { width: 100% ; text-align: center ;}
#sub_h { width: 100% ; text-align: center ; margin: 100px 0 20px 0 ; }
#sub_h_sp { display: none;}

#outline01 { width:100%; text-align: center ; background-color: #FFF8DF; display: inline-block; clear: both; bottom:0;}
.home01 { width: 760px ; text-align: center ; margin: 0 auto ;}
.home01_text01 { width: 760px ; text-align: center ; margin-top: 80px ; float:left; }
.home01_text02 { width: 760px ; text-align: left ; float:left; }
.home01_text02_l { width: 100px ; text-align: center ; float:left; margin-left:40px; }
.home01_text02_r { width: 600px ; text-align: left ; float:left; }
.home01_text02_c { width: 680px ; height:40px; text-align: left ; float:left; margin-left:40px; }

#outline02 { width:100%; text-align: center ; background-color: #EFF5EB; display: inline-block; clear: both; bottom:0;}
.home02 { width: 760px ; text-align: center ; margin: 0 auto ;}
.home02_text01 { width: 760px ; text-align: center ; margin-top: 80px ; float:left; }
.home02_text02 { width: 760px ; text-align: left ; float:left; }
.home02_text02_l { width: 80px ; text-align: center ; float:left; }
.home02_text02_r { width: 600px ; text-align: left ; float:left; }
.home02_text02_c { width: 680px ; height:40px; text-align: left ; float:left; }

#outline03 { width:100%; text-align: center ; background-color: #FFEAEA; display: inline-block; clear: both; bottom:0;}
.home03 { width: 760px ; text-align: center ; margin: 0 auto ;}
.home03_text01 { width: 760px ; text-align: center ; margin-top: 80px ; float:left; }
.home03_text02 { width: 760px ; text-align: left ; float:left; }
.home03_text02_r { width: 600px ; text-align: left ; float:left; margin-left:40px;}
.home03_text02_c { width: 680px ; height:40px; text-align: left ; float:left; margin-left:40px;}

#outline04 { width:100%; text-align: center ; display: inline-block; clear: both; bottom:0;}
.home04 { width: 760px ; text-align: center ; margin: 0 auto ;}
.home04_text01 { width: 760px ; text-align: center ; margin-top: 80px ; float:left; }
.home04_text02 { width: 680px ; text-align: left ; float:left; margin-left:40px;}
.home04_text02_r { width: 680px ; text-align: left ; float:left; background-image: url("images/line_bg01.png") ; }
.home04_text02_r p { line-height: 91px; margin-top:1px; }
.home04_text03_l { width: 760px ; text-align: center ; float:left; }
.home04_text03_r { width: 680px ; text-align: left ; float:right; margin-top:80px; margin-right:40px;}

.home04_text01_sub { width: 760px ; text-align: center ; float:left; }
.home04_text02_sub { width: 760px ; text-align: left ; float:left; }
.home04_text02_sub_l { width: 680px ; text-align: left ; float:left; margin: 70px 0 0 40px;}
.home04_text02_sub_r { width: 680px ; text-align: right ; float:left; margin: 70px 0 0 40px;}
.aboutus01 { width: 680px ; text-align: left ; float:left; background-image: url("images/aboutus_bg01_sp.png") ; border-radius: 12px;}
.aboutus02 { width: 640px ; text-align: left ; float:left; margin: 10px 20px 20px 20px; }
.aboutus02 p { line-height: 90px; margin-top:1px; }

#outline05 { width:100%; text-align: center ; background-color: #F0F0FF; display: inline-block; clear: both; bottom:0;}
.home05 { width: 760px ; text-align: center ; margin: 0 auto ;}
.home05_text01 { width: 760px ; text-align: center ; margin-top: 80px ; float:left; }
.home05_text01_sub { width: 760px ; text-align: center ; float:left; }
.home05_text02 { width: 760px ; text-align: left ; float:left; }
.home05_text03 { width: 760px ; margin-top:70px; text-align: left ; float:left; }
.home05_text02_q1 { width: 680px ; text-align: left ; float:left; background:rgba(255,255,255,0.9); border-radius: 12px 12px 0 0 ; margin-left:40px;}
.home05_text02_q2 { width: 630px ; margin:25px; text-align: left ; float:left; }
.home05_text02_q2 p { color:#D86C00; }
.home05_text02_a1 { width: 680px ; text-align: left ; float:left; background:rgba(255,255,255,0.4); border-radius: 0 0 12px 12px; margin-left:40px;}
.home05_text02_a2 { width: 630px ; margin:25px; text-align: left ; float:left; }

.outline_space01 { width: 100% ; height:80px ; text-align: center ; clear: both; bottom:0;}

.news01 { width: 680px ; text-align: left ; float:left; background-color: #EAF1F7 ; border-radius: 12px; }
.news02 { width: 640px ; text-align: left ; float:left; margin: 20px 20px 20px 20px; line-height: 40px; font-size: 24px; font-family: 'M PLUS Rounded 1c', sans-serif;}
	
.contact01 { width: 680px ; text-align: left ; float:left; background-color: #EAF1F7 ; border-radius: 12px; margin-left: 40px ;}
.contact02 { width: 640px ; text-align: center ; float:left; margin: 0 20px 10px 20px; }
.wpcf7 span.wpcf7-not-valid-tip { color: #D86C00; font-size: 20px;}
.wpcf7-response-output { color: #D86C00; font-size: 20px;}
input { font-size: 20px;}
textarea { font-size: 20px; width: 360px ;}
input[type="submit"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  font-size: 20px;
  font-weight: bold;
  width: 200px; 
  height: 50px;
  border-radius: 10px;
  background-color: #5691BD;
  border: none;
  color: #fff;
  cursor: pointer;
}
span.wpcf7-spinner {
  display: none;
}

#footer { width: 100% ; float:left; margin: 0 auto ; background-image: url("images/bg.png") ;  background-position: center top; clear: both; bottom:0;}
.footer01 { width: 760px ; text-align: center ; margin: 0 auto ;}
.footer01_text01 { width: 680px ; text-align: left ; margin: 80px 0 0 40px ; float:left;}
.footer01_text02 { width: 680px ; text-align: left ; margin: 120px 0 50px 40px ; float:left; }
.footer01_text02_sub { width: 680px ; text-align: left ; margin: 80px 0 50px 40px ; float:left; }
.footer01_text02_l { width: 220px ; text-align: left ; float:left; margin-left:110px; }
.footer01_text02_c { width: 350px ; text-align: left ; float:left; }
.footer01_text02_r { display:none;}
.footer01_text02_r_sp { width: 680px ; text-align: center ; float:left; margin-top: 50px;}
.footer01_text03 { width: 100% ; text-align: center ; float:left; margin-bottom:20px; }

}