@charset "utf-8";

html { overflow-y: scroll; }
img {
    vertical-align: top;
    display: block;
    max-width: 100%;
    height: auto;
    width: auto;
    zoom: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
}

p.ti1 { background: url(../images1114/ti1_bg.gif) no-repeat; margin: 20px 0;}
p.read0 {margin: 0 70px 0px; font-size:120%; line-height:120%; }

.kcc1010 { background:#fff; padding:0px 20px 0px;}

.set_b { background:#fff0d3; margin-top:20px; }
.set_a { background:#d9e2fb; margin-top:20px; }
.set_c { background:#dcf9c8; margin-top:20px; }

.ati { padding: 10px 0;}
.set_a_in { clear:both; overflow: auto; margin-left: 9px; }
p.read {font-size:150%; font-weight:bold; line-height:145%; padding: 0 18px 10px 9px;}

p.read.b {color: #f48809; }
p.read.a {color: #3f43f2; }
p.read.c {color: #009245; }

/*p.des {font-size:110%; padding: 0px 18px 0px 9px;}*/
.clear_b { clear:both; }
.clear.end { width:0;height:0; }

ul.voice { clear:both; overflow: auto; }
ul.voice li { float:left;width:314px; }
/*ul.voice .photo { clear:both; height:auto;overflow: auto;}*/
body {overflow-y: hidden;}

/*ul.voice .photo img { float:left; width:102px; margin-right: 10px;}*/
ul.voice .photo span { float:left; width:102px; margin-right: 10px;}
ul.voice .photo .name { color: #004192; font-weight:bold; }
ul.voice .photo .name.or { color: #02ae57; font-weight:bold;}
ul.voice .photo.b .name { color: #3a9608;}

p.text { clear:both;font-size:160%; }
p.text.c03 { background:#054994;margin:20px 0 0; }
p.text.c03 a { text-decoration:none;color:#FFF;padding:17px 45px 17px 17px;line-height:normal;font-size:100%;display:block; }
.kcc1010 ul { clear:both; overflow: auto; }
.kcc1010 ul li { margin-bottom:20px;padding:0 9px; }
.kcc1010 ul li.banner { float:left;width:314px; }
.kcc1010 ul li img { width:100%; }
.ap_tx {margin-top: 5px; font-size:100%; line-height:130%;}

.sub {padding: 0 18px 15px 9px;font-size:120%; line-height:130%;}
ul li.banner .sub {padding: 0;}
ul li.banner .read {padding: 0;}

ul.voice li .pad_t20.sp {display: none;}

/*
 responsive start
================================================================== */
@media screen and (min-width:641px) and (max-width: 960px){
	.kcc1010 ul li.banner { padding:0; width:48%; margin:0 1%; }
	ul.voice li { padding:0; width:48%; margin:0 1%; }
	.set_a_in { margin-left: 1%; }
	.aread, .bread {font-size:150%; line-height:145%; padding: 0 2% 10px 1%;}
	.kcc1010 ul li.banner .photo{ margin-bottom:20px; }
}

/*
for tablet
================================================================== */
@media screen and (max-width: 768px){
	
}

/*
for smartphone
================================================================== */
@media screen and (max-width: 640px){
	.kcc1010 { padding:0px 10px 0px;}
	.kcc1010 ul li { margin-bottom:20px;padding:0 9px; }
	.kcc1010 ul li.banner { float:none;width:auto;max-width:580px; margin:0 auto 20px; }
	.kcc1010 ul li.banner .photo{ height: auto; width:96%; }
	ul.voice li { float:none;width:auto;max-width:580px; }
	ul.voice li .photo{clear:both; overflow: auto; height: auto;}
	ul.voice li .pad_t20.sp {display: block;}
	.kcc1010 ul li img { max-width:100%;text-align:center; }
	.aread, .bread {font-size:130%; line-height:130%; padding: 0 0% 10px 0%;}
	p.read {margin: 0 0px 0px; font-size:120%; line-height:120%; }
	p.read0 {margin: 0 10px 0px; font-size:120%; line-height:120%; }
	
	.set_a_in { margin-left: 0; }
	.aread, .bread {font-size:140%; line-height:144%; padding: 0 10px 10px 10px;}
	.sub {padding: 0 10px 10px 10px;}
	p.text { font-size:130%; }
	p.text.c03 a { padding:10px 45px 10px 10px; }
}

@media screen and (max-width: 320px){
	/*.drink p.ph {display: none;}*/
	.drink {
	border-radius: 6px;
	border: 3px solid #005bac;
	margin: 10px auto 15px;
	padding: 10px;
	}
	.drink p.ti {color: #005bab;padding-bottom: 10px;font-size: 140%;font-weight: bold;line-height:1.2em;}
	.drink p.ph {float: left; padding: 0 0px 0 10px;}
	.drink p.ph img {width:60%;}
}