@charset "UTF-8";
body { font-family: "Helvetica Neue",
    Arial,"Hiragino Kaku Gothic ProN",
    "Hiragino Sans",Meiryo,sans-serif;color:#333;}    

a:hover{opacity: 0.6;}
.sp{display:none;}
.clr{clear:both;}


.logo{text-align: center;padding:15px 0 0 0;}
.tel-btn{position: absolute;right:1px; top:0;}

header{position: fixed;width:100%;z-index:1;background-color: #fff;}


/*         メニュー      */
#menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin:20px 0 0 0;
box-shadow:0 4px 6px rgba(0,0,0,.1);	
}

#menu-btn {
  display: none;
}

#menu-content {
  margin: 0;
  list-style-type: none;
}

#menu-content > li {
  position: relative;
  float: left;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

#menu-content > li > a {
  display: block;
  padding: 10px 20px;
  line-height: 1.2em;
  color: #000;
  font-size: 18px;
  text-decoration: none;
margin:10px 0 0 0;	
	}
#menu-content > li > a:hover{color: #004f9c;opacity: 1;}

#menu-content > li > a > .blogicon-chevron-down {
  margin-right: 5px;
}

#menu-content > li > ul.second-content {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  padding-left: 0;
  list-style-type: none;
  -webkit-box-shadow: 1px 1px 7px #bbb;
          box-shadow: 1px 1px 7px #bbb;
background-color: #cde5f9;	
}

#menu-content > li:hover > ul.second-content {
  visibility: visible;
  opacity: 1;
  -webkit-transition: opacity 0.2s, visibility 0.2s;
  transition: opacity 0.2s, visibility 0.2s;
}

#menu-content > li > ul.second-content > li {
  text-align: left;
  width: 180px;	
}

#menu-content > li > ul.second-content > li > a {
  display: block;
  line-height: 3em;
  color: #000;
  font-size: 15px;
  text-decoration: none;
  padding:0 0 0 10px;		
}

#menu-content > li > ul.second-content > li > a:hover {
  background: #eee;
  color: #000;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}


/*         メニューおわり      */

.h1_tit{text-align: center;}
h1{color:#333;padding:200px 30px 0 30px;font-size:1.8em;display: inline-block;position: relative; }
 h1::before{
    position: absolute;
    bottom: -30px;
    content: '';
    width: 50px;
	left:50%;
	-moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translate(-50%);	
	border-bottom: 5px solid #D6502D;
}



.h2_area{text-align: center;margin:100px auto 0 auto;}
.h2_area p{padding:20px 0;}
.h2_area h2,.h2_area_2 h2{font-size:1.5em;}
.text-01{padding:60px 0 0 0!important;}

.form_btn { position: fixed;bottom: 10px;right: 10px;z-index: 99999;filter: drop-shadow(3px 3px 10px rgba(0,0,0,0.6));}

.h2_area_2{text-align: center;margin:80px auto 20px auto;}
.h2_area_2 p{padding:20px 0;line-height: 1.5em;}
.stripe{background-size: auto auto;
background-color: rgba(251, 245, 239, 1);
background-image: repeating-linear-gradient(-45deg, transparent, transparent 8px, rgba(251, 221, 205, 1) 8px, rgba(251, 221, 205, 1) 11px );height:1200px;}



.h2_2_area{border-radius: 8px;background-color:#fff;width:960px;height:300px;font-size:1.5em;margin:100px auto 30px auto;padding:30px 0;text-align: center;}

.tab-wrap {
	display: flex;
    flex-wrap: wrap;
    width:1000px; 
    align-content:center;justify-content: center;margin:40px auto;
    
}
.tab-label {
    color: White;
    margin-right: 5px;
    padding: 3px 12px;
    order: -1;
}
.tab-content {
    width: 100%;}

.tab-content{margin: 30px auto;width:990px;}
.tab-content ul{width:300px;box-shadow:0 0 10px rgba(0,0,0,.1); margin:40px 10px;height: 390px;display: inline-block;vertical-align: middle;}
.tab-content ul li{white-space: normal;}
.tab-content ul li:nth-child(2){font-size:1.4em;font-weight:bold;padding:20px;line-height:1.2em;text-align: left;}
.tab-content ul li:nth-child(3){padding:20px;line-height:1.2em;text-align: left;}
.li_tokubetu{padding:3px 10px!important;}
.li_tokubetu_2{padding:20px 10px 5px 10px!important;}
.tab-content a{color:#333;}
.li_tokubetu_5{padding:56px 10px 5px 20px!important;}
.li_tokubetu_6{padding:28px 10px 5px 20px!important;}
.li_tokubetu_7{padding:0 10px 5px 20px!important;}




.btn_area{margin:0 auto;text-align: center;}
.btn_area_2{margin:50px auto 150px auto;text-align: center;}
.more_btn{border:1px solid #D6502D;border-radius:50px;width:315px;margin:70px 10px 70px 10px;text-align: center;display: inline-block;}
.more_btn a{color:#D6502D;padding:20px 10px;display: block;font-weight:bold;font-size:1.1em;}

.h2_3_area{border-radius: 8px;width:960px;height:300px;font-size:1.5em;margin:20px auto;padding:30px 0;text-align: center;}

.h2_3_area ul{display: flex;flex-wrap:wrap;width:960px;align-content:center;justify-content: center;margin:0 auto;}

.h2_3_area ul li{border: 0.5px solid #D3D3D3;border-radius:8px;padding:30px 40px;margin:40px 20px;font-size:0.8em;font-weight: bold;width:198px;line-height:1em }
.s-font{font-weight:normal;font-size:0.6em;}
.h2_3_area ul li a{color:#333;}

.stripe_2{background-size: auto auto;
background-color: rgba(251, 245, 239, 1);
background-image: repeating-linear-gradient(-45deg, transparent, transparent 8px, rgba(251, 221, 205, 1) 8px, rgba(251, 221, 205, 1) 11px );height:600px;position: relative;}

.h2_4_area{border-radius: 8px;background-color:#fff;width:960px;height:300px;font-size:1.5em;margin:100px auto 30px auto;padding:60px 0 30px;text-align: center;position: absolute;top:30px;left: 50%;transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);}

.li_tokubetu{padding:3px 20px!important;}
.li_tokubetu_2{padding:20px 10px 5px 10px!important;}
.li_tokubetu_3{padding:20px 10px 20px 20px!important;}
.li_tokubetu_4{padding:20px 10px 45px 10px!important;}

.h2_4_area ul{display: flex;flex-wrap:wrap;width:960px;align-content:center;justify-content: center;margin:0 auto;}

.h2_4_area ul li{border: 0.5px solid #D3D3D3;border-radius:8px;padding:30px 20px;margin:40px 10px;font-size:0.8em;font-weight: bold;line-height:2em;width:250px;}

.h2_4_area ul li a{color:#333;}

footer{background-color:#000;}
.copy{color:#fff;padding:20px;font-size:0.7em;text-align:center;line-height:1.8em; }
.footer_2{position:absolute;bottom:0;width:100%;}

.box{display:none;}

.tab-content li img{width:100%;}

@media screen  and ( max-width:960px) {
body { font-family: "Helvetica Neue",
    Arial,"Hiragino Kaku Gothic ProN",
    "Hiragino Sans",Meiryo,sans-serif;color:#333;}        
.pc{display:none;}	
.sp{display: block}	
	
h1{width:95%;padding: 20% 0 0 0;}	
	
	
/*バナー*/
.box{
  width: 100%;
  margin: 100px auto 0;display: block;
}
.banner{
  width: 100%;
  height:100px;
  position: fixed;
  left:0;
  bottom:0;
  transition: 0.5s;
}

.banner.hide {
  transform:translateY(100px);
}

.banner .cont{
  color:#fff;
  text-align:center;
  line-height:100px;
  background:rgba(0,0,0,0.5);
  font-size: 200%;
}
.cont img{width:30%; padding:12px 20px;}	
	
.sp_btn{border: 1px #fff solid!important;border-radius: 55px;padding:10px;width:25%;margin:10px auto!important;}
	
/*         メニュー      */	
nav {
    position: fixed;
    top: 0;
    right: -1000px;
    bottom: 0;
    width: 100%;
    background: #004F9B;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    z-index: 3;
    opacity: 0;
  }
  .open nav {
    right: 0;
    opacity: 1;
  }
  nav .inner {
    padding: 25px 0;
	 text-align: center; 
  }
  nav .inner ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  nav .inner ul li {
    position: relative;
    margin: 0;
  }
  nav .inner ul li a {
    display: block;
    color: #333;
    font-size: 14px;
    text-decoration: none;
    -webkit-transition-duration: 0.2s;
            transition-duration: 0.2s;
  }
  .toggle_btn {
  display: block;
  position: fixed;
  top: 10px;
  right: 15px;
  width: 50px;
  height: 50px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  cursor: pointer;
  z-index: 3;
  background-color: #004F9C;
}
  .toggle_btn span {
    position: absolute;
    left: 10px;
    width: 30px;
    height: 3px;
    background-color: #fff;
    border-radius: 4px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
  }
  .toggle_btn span:nth-child(1) {
    top: 15px;
  }
  .toggle_btn span:nth-child(2) {
    top: 25px;
  }
  .toggle_btn span:nth-child(3) {
    bottom: 12px;
  }
  .open .toggle_btn span {
    background-color: #fff;
  }
  .open .toggle_btn span:nth-child(1) {
    -webkit-transform: translateY(10px) rotate(-315deg);
    transform: translateY(10px) rotate(-45deg);
  }
  .open .toggle_btn span:nth-child(2) {
    opacity: 0;
  }
  .open .toggle_btn span:nth-child(3) {
    -webkit-transform: translateY(-10px) rotate(315deg);
    transform: translateY(-10px) rotate(45deg);
  }
  #mask {
    display: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
  }
  .open #mask {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.5;
    z-index: 2;
    cursor: pointer;
  }
  #menu-content > li {
    width: 100%;
	text-align:center;  
  }
  #menu-content > li:hover {
    background: none;
  }
  #menu-content > li > a {
    height: 100%;
    font-size: 100%;
    border-bottom: none;
	color:#fff;  
  }
  #menu-content > li > ul.second-content {
    visibility: visible;
    opacity: 1;
    width: 100%;
    position: relative;
    -webkit-box-shadow: none;
    box-shadow: none;
	background-color:#004f9c;
	margin:0 auto;  
  }
  #menu-content > li > ul.second-content > li {
    width: 98%;
    text-align-last:center;
  }
  #menu-content > li > ul.second-content > li > a {
	padding:0;
	color:#fff;   
  }
  #menu-content > li > ul.second-content > li > a:hover {
    background: none;
  }
    
#menu-content > li > ul.second-content > li{text-align: center;}        

/*         メニューおわり      */	
	
.stripe{height:1900px;}    
.stripe_2{height:350px;}    
.tab-content {margin: 20px auto;width:100%;text-align: center;}    
.h1_tit{width:100%;}
.h2_area h2{width:100%;}    
.h2_area ul,.h2_2_area ul,.h2_3_area ul,.h2_4_area ul{width:80%;}
.h2_area ul img{width:80%;}
    
.h2_2_area h2, .h2_4_area h2 {font-size: 0.8em;}
.h2_2_area ul, .h2_4_area ul {width: 100%;}	
.h2_2_area ul li, .h2_4_area ul li {width: 25%;font-size: 0.4em;padding: 10px;}
.h2_2_area ul li img, .h2_4_area ul li img {width: 30%;}	
	
	
.h2_2_area{width:80%;height:20%;}    
.h2_4_area{width:80%;height:50%;margin: 10px auto 30px auto;}     
.library_area {width:100%;}    
.tab-wrap{width:80%;}


.h2_3_area{width:80%;height:950px;}     

.btn_area {margin: 20px auto 40px auto;}	
.more_btn{margin: 10px 10px 20px 10px;}	
	
}

@media screen  and ( max-width:767px) {
body { font-family: "Helvetica Neue",
    Arial,"Hiragino Kaku Gothic ProN",
    "Hiragino Sans",Meiryo,sans-serif;color:#333;}    	
/*         メニュー      */
.toggle_btn {
    display: block;
    position: fixed;
    top: 15px;
    right: 10px;
    width: 39px;
    height: 39px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
    z-index: 3;
  }
/*         メニューおわり      */
	

	
.cont img{width:44%; padding:0 5px;}
	
	
.toggle_btn span:nth-child(1) {top: 8px;}	
 .toggle_btn span:nth-child(2) {top: 18px;}
 .toggle_btn span { left: 5px;width:29px;border-radius: 1px;}	
 .toggle_btn span:nth-child(3) {top: 28px;}
 .sp_btn{width:38%;}	
	
.slide-items {padding-top:24%;}	

.logo img{width:50%;}
h1{font-size:5vw;padding:100px 0 0 0;}

	
.h2_area{margin: 58px auto 0 auto;}	
.h2_area h2{font-size:4.5vw;}	
.h2_area p{font-size:3.5vw;width:90%;line-height:1.5em;margin:0 auto;}	
	
.text-01{text-align:left;}	

.h2_4_area{width:90%;}		
.stripe_2{height:320px;}    
    
    
.h2_2_area h2,.h2_3_area h2,.h2_4_area h2{font-size:3vw;}    
.h2_4_area ul{width:100%;}	
.h2_2_area ul li,.h2_4_area ul li{margin:15px 10px;width: 18%;
font-size: 1.8vw;;}
.h2_2_area ul li img,.h2_4_area ul li img{width:70%;}
.h2_3_area{height:780px;}
.h2_4_area{margin:10px auto;padding:30px 0 20px 0;}     
.tab-content {margin: 0 auto;}    	
	
.h2_2_area,.h2_4_area{height:44%;}       
.tab-content,.tab-content ul{width:95%;}   
.tab-content ul li{width:100%;}
.tab-content ul li:nth-child(1){text-align: center;}  
.tab-label{padding:15px;}    
.tab-content ul li:nth-child(2),.tab-content ul li:nth-child(3){font-size:4.3vw;width:85%;padding:20px 5px 0;margin:0 auto;text-align: left;line-height: 1.4em;}    
.tab-content ul li img{width:100%;text-align: center;}    
 .h2_4_area ul li{width:20%;font-size:2.5vw;margin:15px 10px;}
.h2_4_area ul li img{width:70%;}
.btn_area{margin:20px auto;}	
.more_btn{margin: 10px;width:40%;font-size:2.8vw;}
.li_tokubetu_3{padding:20px 10px 20px 8px!important;}	
.li_tokubetu_6{padding:28px 10px 5px 8px!important;}	
.li_tokubetu_7{padding:15px 10px 5px 8px!important;}	
.copy{font-size:2.5vw;}    
}	
	
