@charset "utf-8";

/* ----------------------------
   コープのお買い物サポート　CSS
 ------------------------------ */

.tab_idou h2.tt_support {
	color: #37a880;
	font-family: M PLUS Rounded\ 1c, Rounded Mplus\ 1c, Mplus\ 1p, sans-serif;
	margin-bottom:20px;
	font-size: 140%;
}
.tab_sougei h2.tt_support {
	color: #3d72c1;
	font-family: M PLUS Rounded\ 1c, Rounded Mplus\ 1c, Mplus\ 1p, sans-serif;
	margin-bottom:20px;
	font-size: 140%;
}

.tab_idou h2.tt_support span {
	font-size:80%;
}
.tab_sougei h2.tt_support span {
	font-size:80%;
}
.tab_idou h3 {
	color: #37a880;
	font-size:120%;
	font-family: "Zen Kaku Gothic New", sans-serif;
}
.tab_sougei h3 {
	color: #3d72c1;
	font-size:120%;
	font-family: "Zen Kaku Gothic New", sans-serif;
}
.kadou_s {
	border:#FF580F 1px solid;
	padding:8px 14px;
	display: inline-block;
}
.tab_idou .kadou {
	border:#37a880 1px solid;
	background:#fff;
	padding:8px 14px;
	display: inline-block;
}


.tab_idou .osusumepoint_box {
	background-color:#ffffff;
	border-radius:20px;
	border:1px solid #37a880;
	padding:20px;
}
.tab_sougei .osusumepoint_box {
	background-color:#ffffff;
	border-radius:20px;
	border:1px solid #3d72c1;
	padding:20px;
}

 /** タブ切り替えのスタイル **/
 .tabs {
   margin-top: 50px;
   padding-bottom: 40px;
   background-color: #fff;
   width:100%;
   margin: 0 auto;
 }
 .tab_item {
   width: calc(100%/2);
   height: 50px;
   background-color: #f4f4f4;
	 border:1px solid #ccd0d1;
   line-height:45px;
   text-align: center;
   color: #333333;
   display: block;
   float: left;
   text-align: center;
   transition: all 0.2s ease;
	 font-size: 90%;
	 font-weight: bold;
 }
 .tab_item:hover {
   opacity: 0.75;
 }
 input[name="tab_item"] {
   display: none;
 }
 .tab_content {
   display: none;
   clear: both;
   overflow: hidden;
 }
 #all:checked ~ #all_content,
 #programming:checked ~ #programming_content {
   display: block;
 }
 .tabs input:checked + .tab_item_idou {
   background-color: #e8f9ef;
   color: #37a880;
	 border-top:2px solid #37a880;
	 border-left:none;
	 border-right:none;
	 border-bottom:none;
   font-weight: bold;
	 font-size: 110%;
 }
 .tabs input:checked + .tab_item_sougei {
   background-color: #e1f1f9;
   color: #3d72c1;
	 border-top:2px solid #3d72c1;
	 border-left:none;
	 border-right:none;
	 border-bottom:none;
   font-weight: bold;
	 font-size: 110%;
 }

.hyo1 td {
	background-color: #fff;
}
.hyo1 td.gray {
	background-color: #f1f2f2;
}


/* PC用 */
@media screen and ( min-width:1100px ) {
	.tabbox {
		width:1100px;
		margin:40px auto 0;
	}
}
@media screen and ( min-width:641px ) {
	h1 { margin-bottom:20px; }
	.tab_idou h2.tt_support,
	.tab_sougei h2.tt_support {
		text-align: left;
	}
	.box_txt {
		width:48%;
		float: left;
	}
	.box_img {
		width:48%;
		float:right;
	}
	.teiryulist {
		width: 100%;
    margin: 0 auto 20px;
    overflow: hidden;
	}
	.teiryulist li {
		width: calc((100% - 45px) / 4);
		background: #fff;
		float: left;
		margin-right:15px;
		margin-bottom:15px;
	}
	.teiryulist li:nth-child(4n) {
		margin-right:0;
	}
	.telarea {
		margin-bottom:100px;
	}
	.tab_idou {
		background-color: #e8f9ef;
		padding:40px;
 }
 .tab_sougei {
	 background-color: #e1f1f9;
	 padding:40px;
 }
 .tab_idou .osusumepoint_box img,
 .tab_sougei .osusumepoint_box img {
 	width:30%;
	text-align:left;
 	margin:0 0 10px 5px;
 }
 .map_area {
	 margin-bottom:100px;
 }
}
/* スマホ用 */
@media screen and ( max-width:640px ) {
	h1 img { padding:20px 20px 0 15px; }
	.tab_idou h2.tt_support,
	.tab_sougei h2.tt_support {
		text-align:center;
	}
	.tab_sougei h2.tt_support span {
		display: block;
	}
	.tabbox { margin-top:20px; }
	.telarea { margin-bottom:80px; }
	.tab_idou {
		background-color: #e8f9ef;
		padding:20px;
	}
	.tab_sougei {
		background-color: #e1f1f9;
		padding:20px;
	}
	.tab_idou .osusumepoint_box img,
	.tab_sougei .osusumepoint_box img {
		width:80%;
		margin-bottom:15px;
	}
	.tab_idou .osusumepoint_box .osusume_tit {
		text-align: center;
	}
	.teiryulist {
		width: 100%;
    margin: 0 auto 30px;
    overflow: hidden;
	}
	.teiryulist li {
		width: calc((100% - 12px) / 2);
		background: #fff;
		float: left;
		margin-right:12px;
		margin-bottom:12px;
	}
	.teiryulist li:nth-child(2n) {
		margin-right:0;
	}
	.map_area {
		margin-bottom:70px;
	}
}

.slick-slide img {
	display: block;
	width: 100%;
	border-radius:10px;
}
.slick-prev,
.slick-next {
	display:none !important;
}
.slick-dots li {
	margin: 0 1px !important;
}
.tab_idou .slick-dots li.slick-active button:before {
    opacity:1;
    color:#37a880;
}