@charset "UTF-8";

/* ########### 768px以上ここまで① ########### */

/*===============================================
●スマホ画像切り替え②
===============================================*/
@media screen and (min-width: 770px) {

#sp-topphoto{
  	width: 1000px;
  	margin : 0px auto;margin-left : auto;
}

.sp-photo-01{
	
	background-color: transparent;background-image : url(../../image/img19/image001.jpg);background-repeat : no-repeat;background-attachment : scroll;background-position : center top;background-size : auto auto;background-origin : padding-box;background-clip : border-box;	
	height: 338px;	
	width: 1000px;
}

p.img{
	display:none;
	text-align:center;
}
}
/* ########### スマホ切り替えここまで② ########### */


/* ########### photo ########### */
.photoall img{
  max-width: 1000px; min-width: 240px; 
  width : 100%;  
  height : auto;
}

.photo01 img{
  max-width: 1000px; min-width: 240px; 
  width : 96%;  
  margin-bottom : 20px;  
  height : auto;
  margin-left : 2%;
  margin-right : 2%;
}

.photo02{
	text-align: center;
	margin-top: 10px;
	margin-right: 2px;
	margin-left: 2px;
}

.photo02 img{
  max-width: 480px; min-width: 120px; 
  width : 46%;   
  height: auto;
  margin-left : 2%;
  margin-right : 2%;
  float: left;
  margin-bottom : 10px;
}

/* ########### photo ########### */



/* ################################################################################ */
/*===============================================
●PC.css  画面の横幅が770px以上①
===============================================*/
@media (min-width: 770px) {
.photo03{
  text-align : center;  
  margin-right : 10px;  
  margin-left : 10px;
margin : 10px;
}

.photo03 img{
  max-width: 300px; min-width: 120px; 
  width : 31%;   
  height: auto;
  margin-left : 1%;
  margin-right : 1%;
  float: left;
  margin-bottom : 10px;
}

.photo02sp{
	
	display: none;	
}

.photo02sp img{
	display: none;	
}

.toptopixA{
  margin-top : 20px;
  width : 100%;
    margin-bottom : 35px;
  }

.toptopixB{
  margin-top : 20px;
  width : 100%;
    margin-bottom : 20px;
  }

.toptopixC{
    margin-bottom : 10px;
  }

.toptopix01{
  float : left;
    width : 50%;
  }

.toptopix01 li{
  float : left;
  margin-right : 2%;
  margin-left : 2%;
}

.toptopix02{
  float : right;
  display : inline;
  width : 50%;
}

.toptopix02 li{
  float : right;
  margin-left : 2%;
  margin-right : 2%;
}

.toptopix03{
  float : left;
    width : 50%;
  }

.toptopix03 li{
  float : left;
  margin-right : 1.6%;
  margin-left : 1.6%;
}

.toptopix04{
  float : right;
  display : inline;
  width : 50%;
}

.toptopix04 li{
  float : right;
  margin-left : 1.6%;
  margin-right : 1.6%;
}

}
/*===============================================
●SP.css  画面の横幅が770pxまで③
===============================================*/
@media screen and (max-width:770px){
.photo02sp{
	
	text-align: center;	
	margin: 2px;	
}

.photo02sp img{
	
	max-width: 500px;	
	min-width: 120px;	
	width: 48%;	
	height: auto;	
	margin-left: 1%;	
	margin-right: 1%;	
	float: left;	
	margin-bottom: 4px;	
}
.photo03{
	display: none;	
}

.photo03 img{
	display: none;	
}

#undermenu-■■{
	margin-bottom: 20px;  
    background-color : #dfdfdf;  
    width : 100%;  
}

.underm{
	
	margin-bottom : 5px;	
    margin-left : 10px;
    margin-right : 10px;
  }

.underm li +li{
	
	border-top-width: 1px;	
	border-top-style: solid;	
	border-top-color: #e7e7e7;	
}

.underm a{
	
	display: block;	
	padding : 10px 5px 10px 12px;	
	color: gray;	
	text-decoration: none;	
	position: relative;	
	background-color: white;	
}

.underA a:hover{
	background-repeat: repeat;
	background-attachment: scroll;
	background-position: 0% 0%;
	background-size: auto auto;
	background-origin: padding-box;
	background-clip: border-box;
	text-decoration: none;
}

.underm a::after{
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #cecece;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #cecece;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	right: 15px;
	top: 0px;
	bottom: 0px;
	margin: auto;
}

.under01{
	
	padding-bottom : 10px;	
	border-bottom-width : 2px;	
	border-bottom-style: solid;	
	border-bottom-color : #ff8080;	
	text-align: center;	
	background-color : #f2f2f2;	
	font-size : 14px;	
	padding-top : 10px;	
	color : #666666;
	margin-left : 10px;
	margin-right : 10px;
  }

.under02{
	padding-bottom : 10px;
	border-bottom-width : 2px;
	border-bottom-style: solid;
	border-bottom-color : #8080ff;
	text-align: center;
	background-color: white;
	font-size: 14px;
	padding-top : 10px;
	color: gray;
	margin-left : 10px;
	margin-right : 10px;
}

.toptopixA{
	max-width: 100%;
	text-align: center;
	width: 100%;
	height : auto;  
    margin-bottom : 20px;
  
  }

.toptopixB{
	max-width: 100%;
	text-align: center;
	width: 100%;
	height : auto;
  }

.toptopixC{
    margin-bottom : 10px;
  }

.toptopixA img{
	width: 100%;
	height: auto;
}

.toptopixB img{
	width: 100%;
	height: auto;
}

.toptopix01{
	
	width: 100%;	

    margin-bottom : 20px;
  }
.toptopix01 li{
	float: left;
	width: 46%;
	height : inherit;
	margin-left : 2%;
	margin-right : 2%;  
 	display : inline;
}
.toptopix02{
	
	width: 100%;	
}

.toptopix02 li{
	float: left;
	width : 46%;
	height : inherit;
	margin-left : 2%;
	margin-right : 2%;  
 	display : inline;
}

.toptopix03, .toptopix04{
	
	width: 100%;	
    margin-bottom : 20px;
}

.toptopix03 li, .toptopix04 li{
	float: left;
	height : inherit;
	margin-left : 2.666666%;
	margin-right : 2.666666%;  
 	display : inline;
    width : 28%;
}

}

