@charset "utf-8";


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



/* ---------------------------------------------
	css
--------------------------------------------- */
p,li,dt,dd,a,h1,h2,h3,h4{
	font-size: 12px;
	line-height: 1.6em;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}


.inner {
	min-width: 0;
}


section dl {
	text-align: left;
}


h3 {
	font-size: 16px;
	padding-bottom: 0;
}

.br-sp{
	display: block;
}

.pc {display:none;}
.sp {display:block;}



/*-------------------------------------------------------------------------
		header
--------------------------------------------------------------------------*/
header .inner {
	height: 33px;
}


header .inner .logo {
	width: 107px;
	top: 4px;
	left: 16px;
}
	

/*-------------------------------------------------------------------------
		modal
--------------------------------------------------------------------------*/

.modal{
display: none;
}

.modalwrap{ 
position: fixed;
z-index: 7777;	
top: 50%;
left: 50%;
transform: translate(-50%,-50%);	
width: 600px;
margin: 0 auto;
background-color: #FFFFFF;
font-family:Meiryo, “sans-serif”;
font-feature-settings: “palt”;	
padding: 41px 30px 35px;	
text-align: center;
}

.modalwrap p {
margin-bottom:10px; 
line-height: 1.5;
color: #000000;
font-size: 16px;
font-family: Meiryo, "sans-serif";}

.modalwrap a{ cursor:pointer; }

.modatext_b img{
padding-top: 20px;
width: 200px!important;
object-fit: contain;
padding-bottom: 15px;}

.modalwrap ul{
width: 80%;
margin: 0px auto 20px;	
display: flex;
justify-content: space-between;	
}

.modalwrap li{
	width: 47%;}

.modalwrap li a{
height: 60px;
display: flex;
justify-content: center;
align-items: center;	
color: #FFFFFF;	
background-color:#483729;	
font-size: 20px;
font-weight: bold;
text-decoration: none;	
position: relative;	
}

.modalwrap li a:hover{
transition: 0.3s ease;
background-color:#ef3c52;	}

ul.modalbutton li span:before{
position: absolute;
left: 20px;
margin-top: 3.3%;
content: "";
 display: inline-block;
width: 1em;
height: 1em;
background: url(../images/arrow.png) no-repeat;
background-size: contain;}

p.modaltext_a{
display: inline-block;
font-size: 28px;
font-weight: bold!important;
margin: 10px 0 15px;
line-height: 1.3;
font-family: Meiryo, "sans-serif";}

.BtnText_01 li{
margin-top:-3%;
font-size:15px;}

input[type="checkbox"] {
border-color: #000000;}


	


/*-------------------------------------------------------------------------
		navi
--------------------------------------------------------------------------*/
.sp_navi_wrap {
width:100%;
height:60px;
padding:0;
position: static;
top:0;
right:0;
z-index:100;}
	
.sp_navi_wrap.fixed{
position:fixed;
top:0;
z-index:100;}	

.sp_navi_wrap .sp_navi_a li {
margin:0;
width:100%;
height:60px;
vertical-align:top;
display:block;
text-align:center;
font-size:20px;
line-height:30px;
letter-spacing:0.85px;
font-weight:bold;
position:relative;}



/*============
sp-nav
=============*/
.navi--sp {
  display: none;
  position:fixed;
  top: 0;
  left: 0;
  bottom:0;
  width: 100%;
  background-color:rgba(255,255,255,0.9);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  z-index: 50;
}
	
.open .navi--sp {
  display: block;
}
.navi--sp .inner {
  padding: 60px 15px 15px;
}
.navi--sp .inner ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.navi--sp .inner ul li {
  position: relative;
  margin: 0;
  border-bottom: 1px solid #333;
  text-align:center;
}
.navi--sp .inner ul li a {
  display: block;
  color: #151515;
  font-size: 175%;
  padding: 1em 5px;
  text-decoration: none;
  transition-duration: 0.2s;
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  font-weight:900;
}



/*============
sp-.toggle_btn
=============*/
.toggle_btn {
  display: block;
  position:absolute;
  top: 0;
right: 0;
  width: 100%;
  height: 30px;
  transition: all .5s;
  cursor: pointer;
  z-index: 300;
  padding-top:40px;
background-color: #483729;	
}
	
.toggle_btn span {
  display: block;
  position: absolute;
right: 12px;
  width: 20px;
  height: 1px;
  background-color: #e5e974;
  transition: all .5s;
}
.toggle_btn span:nth-child(1) {
  top: 13px;
}
.toggle_btn span:nth-child(2) {
  top: 19px;
}
.toggle_btn span:nth-child(3) {
  top: 25px;
}
.open .toggle_btn span {
  background-color: #e5e974;
}
.open .toggle_btn span:nth-child(1) {
  -webkit-transform: translateY(6px) rotate(45deg);
  transform: translateY(6px) rotate(45deg);
}
.open .toggle_btn span:nth-child(2) {
  opacity: 0;
}
.open .toggle_btn span:nth-child(3) {
  -webkit-transform: translateY(-6px) rotate(-45deg);
  transform: translateY(-6px) rotate(-45deg);
}





/*-------------------------------------------------------------------------
		main-v
--------------------------------------------------------------------------*/
#main {
  width: 100%;
  min-width: 0px;
	height: auto;
}

#main img{
margin-top: -18px;		
  width: 100%;
	height: auto;
}




/*-------------------------------------------------------------------------
		#contents common
--------------------------------------------------------------------------*/
.contentswrap{	
padding: 0;	
margin-top: -1px;	
 min-width: 0px;	
background: url("../images/background.png") repeat;
}


	
#contents h2 {
margin: 0 auto;
overflow: hidden;
}


article {
	width: 100%;
	margin: 0 auto;
}



#sec01,#sec02 {
  width: 100%;
 max-width:auto;		
  min-width: 0px;
}

#sec03 {
  width: 100%;
  min-width: 0px;
}


#sec01 h2,#sec02 h2,#sec03 h2 {
	text-align: center;
}



/*-------------------------------------------------------------------------
		#sec01
--------------------------------------------------------------------------*/

#sec01 h2{
 max-width: 100%;	
margin-bottom: 0;
padding: 80px 30px 12px;
}

#sec01 h2 img {
  max-width: 100%;
  width: 100%;
  height:auto;
}
	

.column_a{
width: auto;	
display:flex;
flex-direction: column;
justify-content: space-between;
align-items: center;}

.column_a img{
width:100%;
object-fit: contain;}

.column_aa{
width: 90%;
margin: 30px auto 80px;
order: 2;}

.column_aaa{
width: 100%;
order: 1; }

.column_b{
width: auto;	
display:flex;
flex-direction: column;	
justify-content: space-between;
align-items: center;}

.column_b img{
width:100%;
object-fit: contain;}

.column_bb{
width: 100%;}

.column_bbb{
width:90%;
margin: 30px auto 80px;}
	
	






/*-------------------------------------------------------------------------
		#sec02
--------------------------------------------------------------------------*/

#sec02{
margin:0 0 70px; 
}
	
#sec02 h2{
 max-width: 100%;	
margin-bottom: 0;
padding: 72px 30px 0;
}

#sec01 h2 img {
  max-width: 100%;
  width: 100%;
  height:auto;
}


.originimage{
padding:0 30px;	}	



/*-------------------------------------------------------------------------
		#sec03
--------------------------------------------------------------------------*/


#sec03 h2{
 max-width: 100%;	
margin-bottom: 0;
padding: 72px 30px 0;}


#sec03 div {
	margin: 0 auto;
	text-align: left;}
	
.column_c{
width: 90%;	
display:block;	
margin: 0 auto;
padding-bottom: 70px;
align-items: center;
justify-content: space-between;}

.column_c img{
width: 100%;
padding-top: 50px;
object-fit: contain;}
	




/*-------------------------------------------------------------------------
		footer
--------------------------------------------------------------------------*/
small {
  font-size: 10px;
  line-height: 1.2;
}


footer{
	padding: 6px 0;
	min-width: 0;
	min-width: initial;
}


footer .inner {
text-align: left;	
max-width:100%;
width: 100%;
font-size: 14px;
padding: 10px 18px;
font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"}	
	

ul.footercolumn{
width: 100%;
display: flex;	
flex-wrap: wrap;
justify-content: space-between;
margin: 10px 0 20px;}

.footercolumn li{
width: 48%;
padding:5px 0 5px}

.footercolumn li a{
display:block;
padding: 2px 10px;
text-align: center;	
border: 1px solid #FFFFFF;	
border-radius: 50px;
font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
color: #FFFFFF;
font-size: 14px;	
text-decoration: none;}	
	

.gotop {
	width: 40px;
}




}




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


/*-------------------------------------------------------------------------
		modal
--------------------------------------------------------------------------*/
	
.modalwrap{ 
position: fixed;
z-index: 7777;	
top: 50%;
left: 50%;
transform: translate(-50%,-50%);	
width: 90%;
margin: 0 auto;
background-color: #FFFFFF;
padding: 60px 30px 35px;}	
	

	
.modatext_b img{
display: block;	
text-align: center;	
margin: 0 auto;
width: 200px!important;
object-fit: contain;
padding-bottom: 15px;}
	
.modalwrap p {
text-align: left;
margin-bottom:10px; 
line-height: 1.5;
font-size: 16px;	}	
	
.modalwrap ul{
width: 100%;
margin: 6px auto 15px;	
display: flex;
justify-content: space-between;	
}

.modalwrap li{
width: 48%;
padding-bottom: 0px;}	
	
p.modaltext_a{
text-align: center;
display: inline-block;
font-size: 28px;
margin: 10px 0 15px;
line-height: 1.3;
font-weight: bold!important;
font-family: Meiryo, "sans-serif";}	
	
}