/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 09 2024 | 06:12:07 */
/*TOPページ比較-------------------------------*/

input[type="button"],
button,
select {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
  color: #000
}
	
/*追加部位--------------------*/	
.wh-select-kantanBox {
	background-color:#C3D0A9; 
	width:650px; 
	margin:0px auto;
	}
	
.wh-select-kantan {
	background-color:#9EA6FF; 
	width:282px; 
	margin:0 auto;	
	}

.serchBox {
	background-color:#fff;
	padding:0px 0px 0px 0px;
	width:1200px;
	margin:0px auto;
	margin-bottom:20px;
	box-shadow: 0px 0px 13px -2px #777;
	border-radius:16px;
	}
.serchCate {
	padding:20px;			
	}	
	
.selectBox {
  padding:15px;
  width:200px;
  display:inline-block;
  position:relative;
  margin:2px;
  border: none; /* ボーダーなし */
  border:2px solid #ccc;
  border-radius:10px; 
}

option{
  border-bottom:1px solid #eaeaea;
  border-left:3px solid white;
  appearance:none;
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid #000;
  border-radius: 0px;
}
	

option:hover{
  background-color:white;
  border-left:3px solid #f3a1a1;
}
button{
    background-color: #4b92fc; /* 背景色 */
    color: white; /* 文字色 */
    padding: 15px 32px; /* パディング */
    text-align: center; /* 文字のアライメント */
    text-decoration: none; /* 文字装飾 */
    display: inline-block; /* ボタンの表示方法 */
    font-size: 16px; /* フォントサイズ */
    font-family: Arial, sans-serif; /* フォント */
    margin: 5px; /* 外側の余白 */
    cursor: pointer; /* カーソル */
    border: none; /* ボーダーなし */
    border-radius: 5px; /* ボーダーの角丸 */
	}	
button:hover {
    background-color: #67a3fb;
    transform: scale(1.1);
}

/*比較選択ボックスタイトル-------------*/
.searchBoxTitleMainBox {
	background-color:#5A8EF5;
	border-radius:16px 16px 0px 0px;		
	}	
.searchBoxTitleMain {
	text-align:center; 
	padding:20px 0px 0px 0px; 
	font-weight:bold; 
	color:#fff; 
	font-size:120%;	
	}	
.searchBoxTitleSub {
	text-align:center; 
	color:#fff; 
	padding-bottom:10px;	
	}
.searchBoxTitleImg {
        text-align:center;
}
.searchBoxTitleImg img{
        width:30%;
}

	
/*▼項目▼----------*/
.condition_searchBox {
    background-color:#fff; 
    overflow:hidden; 
    clear:both;
    border-left: 1px solid #ccc;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding:0;
	margin:0;
	width:auto;
	float:left;
	font-size:90%;
	line-height:2em;
    display: none;/* 初期状態では非表示 */
}
/*▼項目内▼----------*/ 
.condition_search {
    background-color:#caeefc;
    width:180px;
    padding:0;
    margin:0;
    float:left;
    border-right: 1px solid #ccc;	
}    
.condition_search p {
    margin:0;
    border-bottom: 1px solid #ccc;
	padding:5px;

}

.condition_price {
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
	background-color:#F89395;
	margin:0;
    padding:5px;
	width:100%;
	font-weight:bold;
        color:#ff3366;
}
.condition_price_btnTitle {
    background-color:#caeefc;
	padding:5px;
	height:47px;
	line-height:3.6em;
	}
		
.condition_price_btn {
    background-color:#fff;
	padding:5px;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;	
	}
	
.condition_price_btnLink {
	width:90%; 
	text-align:center; 
	border-radius:10px; 
	padding:5%;	
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border-bottom: 4px solid #CC6D14;
    transition: 0.3s;
    background-color: #ff9700;

	}
	
.condition_price_btnLink a {
	width:100%;
	display:block;
	color:#fff;
	text-decoration: none;
	}

.condition_price_btnLink a:hover {
      letter-spacing: 0.15em;
}	
	
.condition_price_btnLink2 {
	width:90%; 
	text-align:center; 
	border-radius:10px; 
	padding:5%;	
    margin: 0px auto;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    display: flex;
    text-decoration: none;
    color: #ffffff;
    border-bottom: 4px solid #BD5450;
    transition: 0.3s;
    background-color: #F66E68;
	}
	

.condition_price_btnLink2 a {
	width:100%;
	display:block;
	color:#fff;
	text-decoration: none;
	}

.condition_price_btnLink2 a:hover {
      letter-spacing: 0.15em;
}	

/*▼各項目▼----------*/    
.condition_oprice_shopList {
    list-style: none;
    padding:0;
    margin:0;
	display: -webkit-flex; display: flex;
	background-color:#fff;
	font-size:90%;
	line-height:2em;
}    
.condition_oprice_shopList {
     margin:0;
	padding:0;
	}
.condition_oprice_shopList p {
    width:180px;
    padding:0;
    margin:0;
    text-align:right;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    padding:5px;
    background-color:#fff;
}    
.condition_oprice_shopList p:first-child {  
    border-right: 1px solid #ccc;   
    border-top: 1px solid #ccc; 
}    

/*項目タイトル*/
.porice_shopName {
	background-color:#fff;
}  
	
.resultSearchBox{
	margin:0px auto;
	padding:10px;
	width:1200px;
	overflow-x: auto;	
	}
.serchCautionTxt {
       text-align:center;
       color:#ff6666;	
        }
.wh_shopTitle {	
    height:45px;
	line-height:45px;	
	}
.wh_shopTitleImg {	
	height:45px; 
	background-color:#F9B1B2;
	}
.wh_shopTitleImg img {
	width:100%;
	}
	
/*-------------PC----------------*/
@media screen and (min-width: 768px){ 
  /* body
--------------------------------*/		
.selectListBox {
	width:628px; 
	margin:5px auto;	
	}
		
.selectButtonBox {
	width:300px; 
	margin:0px auto; 
	padding:10px;	
	}	
	
	}

/*--------------スマホ-----------------*/
@media only screen and (max-width: 767px) {
  /* body
--------------------------------------*/
.serchBox {
	background-color:#fff;
	padding:0%;
	width:92%;
	}
.searchBoxTitleMain {
	font-size:120%;	
	}	
.searchBoxTitleSub {
	padding:0% 2% 2% 2%;  
	text-align:center; 
	color:#fff; 
	padding-bottom:10px;	
	}
.serchCate {
	padding:2%;			
	}	
.selectBox {
  padding:15px;
  width:98%;
  display:inline-block;
  position:relative;
  margin:1%;
  border: none; /* ボーダーなし */
  border:2px solid #ccc;
  border-radius:10px; 
}
.selectListBox {
	width:96%; 
	margin:5px auto;
	padding:2%;
	}
		
.selectButtonBox {

	text-align:center;	
	margin:2%;
	padding:2%;
	
	
	}
.resultSearchBox{
	margin:0px auto;
	padding:10px;
	width:100%;
	overflow-x: auto;
	font-size:90%;
	}
.condition_search {
    max-width:130px;
}   
	
.condition_oprice_shopList p {
    width:130px;
    padding:0;
    margin:0;
    text-align:right;
    border-bottom: 1px solid #999;
    border-right: 1px solid #999;
	padding:5px;
}    
.condition_price_btn {
	height:38px;
	}	
	
.condition_price_btnTitle {
	height:38px;
	}
.resultSearchBox{
	margin-top:4%;
	padding:1%;
	width:98%;
	overflow-x: auto;	
	}
.searchBoxTitleImg img{
        width:60%;
}
.wh_shopTitle {	
    height:30px;
    line-height:30px;
	}	
.wh_shopTitleImg{
	height:30px;	
	}
	
	
	}
	

/*TOPページスライダー------------------------*/


.swiper-wrapper {
  /* wrapperのサイズを調整 */
  width: 90%;
  height: 300px !important;
}

.swiper-slide {
  /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
  width: calc((100% - 40px) / 3); /* 1200pxで3スライドの場合 */
  height: 100%;
  text-align: center;
  padding: 20px 5px 5px 5px;
  margin: 0 10px 0 0px;	
  box-sizing: border-box;
  border-radius:10px;
}

.swiper-slide:nth-child(3n + 1) {
  background-color: #caeefc;
}

.swiper-slide:nth-child(3n + 2) {
  background-color: #caeefc;
}

.swiper-slide:nth-child(3n + 3) {
  background-color: #caeefc;
}

.swiper-pagination-bullets {
  width: 100px;
}

.swiper-pagination-bullet {
  width: 12px !important;
  height: 12px !important;
  margin: 0 0 0 10px !important;
  background: #fff;
}

.swiper-pagination-bullet:first-child {
  margin: 0 !important;
}
	
.swiperBoxTitle {
	font-weight:bold; 
	color:#4C92FC; 
	font-size:110%; 
	padding:0; 
	margin:0; 
	border-bottom:1px solid #4b92fc; 
	display:inline-block;	
	}
.swiperBoxTxt {
	padding:0; 
	margin:0px; 
	color:#4C92FC; 
	font-size:90%;	
	}	
.swiperBoxTxt2 {
	padding:0; 
	margin:4px; 
	color:#4C92FC; 
	font-size:90%;
	text-align:left;
	}
.swiperListBox {
	display: flex; 
	justify-content: 
	space-between; 
	align-items: center; 
	width:97%; 
	list-style-type: none; 
	padding:0; 
	margin:2%; 
	height:36px; 
	background: linear-gradient(to right, #fff, #caeefc);
	}
.swiperList_1 {
	flex: 1 1 40%; 
	display: flex; 
	align-items: center;	
	}
	
.swiperList_1 img {
	width: 100%; 
	height: auto;			
	}	
	
.swiperList_2 {
	flex: 1 1 40%; 
	display: flex; 
	align-items: center; 
	justify-content: center; 
	line-height:36px; 
	background-color:#4C92FC; 
	color:#fff; 
	margin:0 2px 0 0;	
	}	

/*書面申し込み*/	
.swiperList_3 {	
	flex: 1 1 20%; 
	display: flex; 
	align-items: center; 
	justify-content: center; 
	border-radius:10px; 
	line-height:100%; 
	height:36px; 
	color:#fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #ffffff;
  border-bottom: 2px solid #BD5450;
  transition: 0.3s;
  background-color: #F66E68;
	}
/*ネット申し込み*/	
.swiperList_4 {	
	flex: 1 1 20%; 
	display: flex; 
	align-items: center; 
	justify-content: center; 
	border-radius:10px; 
	line-height:100%; 
	height:36px; 
	color:#fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #ffffff;
  border-bottom: 2px solid #CC6D14;
  transition: 0.3s;
  background-color: #ff9700;

	}
.swiperList_3 a {
	width:100%;
	display:block;
	color:#fff;
	text-decoration: none;
        font-size:80%;
	}
.swiperList_4 a {
	width:100%;
	display:block;
	color:#fff;
	text-decoration: none;
        font-size:80%;
	}	
	
.swiperList_3:hover {
    transform: scale(1.1);
	}	
.swiperList_4:hover {
    transform: scale(1.1);
	}	
	
	
/*--------------スマホ-----------------*/
@media only screen and (max-width: 767px) {
  /* body
--------------------------------------*/	
.swiper-slide {
  /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
  width: 96%;
  height: 100%;
  text-align: center;
}
	
}

