﻿@charset "utf-8";

/* ================================================
	common style
	source file:style.css
	target:CSS Level 2
================================================ */

/* common style */
* {margin:0;padding:0}
html {-webkit-text-size-adjust:none}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin:0;padding:0;border:0;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display:block;}
body, input, select, textarea, button {font-family:Helvetica, Verdana, Arial, sans-serif;font-size:13px;color:#666;}
input, select, textarea, button {vertical-align:middle}
input[type=text] {height:30px;line-height:30px;border:solid #a5a5a5 1px;background:#FFF}
input[type=number] {height:30px;line-height:30px;border:solid #a5a5a5 1px;background:#FFF}
input[type=file] {height:30px;line-height:30px;border:solid #a5a5a5 1px;background:#FFF}
input[type=password] {height:30px;line-height:30px;border:solid #a5a5a5 1px;background:#FFF}
input[type=image] {-webkit-appearance:none;-webkit-border-radius:0}
select {font-size:13px;color:#666;border:solid #a5a5a5 1px}
textarea {padding:5px;line-height:16px;border:solid #a5a5a5 1px;overflow:auto}
a {color:#666;text-decoration:none;outline:0;}
img {border:0;vertical-align:middle;}
ul, ol {list-style:none}
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0}
legend, hr {overflow:hidden;position:absolute;top:0;left:0}
legend, hr, caption {visibility:hidden;font-size:0;width:0;height:0;line-height:0}
table {border-collapse:collapse;border-spacing:0;}

/* basic layout & align */
.left {float:left !important}
.right {float:right !important}
.clear {clear:both}

.al_l {text-align:left !important}
.al_r {text-align:right !important}
.al_c {text-align:center !important}

/* basic link */
a {text-decoration:none;cursor:pointer}
a:link {text-decoration:none}
a:visited {text-decoration:none}
a:hover {text-decoration:none}
a.underline {text-decoration:underline}

/* basic others */
.show {display:block}
.hide {display:none}
.ir *,
.blind {position:absolute;width:0;height:0;font-size:0;line-height:0;text-indent:-9999px;overflow:hidden;visibility:hidden}

/* web */
#wrap-web {width:1020px;margin:0 auto;}

/* mobile */
#wrap {width:100%;background:#f5f5f5;}
#wrap img {width:100%;}
#wrap .questions {background:url(/images/survey/mobile8.jpg) repeat-y;background-size:100% 100%;}
#wrap .questions ul {margin:0 5%;border:1px solid #ddd;
	border-radius:3px;
	-moz-lborder-radius:3px;
	-webkit-border-radius:3px;
	-ms-border-radius:3px;
}
#wrap .questions li {padding:10px 10px;font-size:1.063em;
	background: rgba(255,255,255,1);
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 80%, rgba(245,245,245,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(80%, rgba(246,246,246,1)), color-stop(100%, rgba(245,245,245,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 80%, rgba(245,245,245,1) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 80%, rgba(245,245,245,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 80%, rgba(245,245,245,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 80%, rgba(245,245,245,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0 );
}
#wrap .questions li.active {
	-webkit-box-shadow: inset 5px 5px 10px -5px rgba(197,197,197,1);
	-moz-box-shadow: inset 5px 5px 10px -5px rgba(197,197,197,1);
	box-shadow: inset 5px 5px 10px -5px rgba(197,197,197,1);
	background:#e4e4e4;
}
#wrap .questions span {font-size:1.063em;display: inline-block;background:#e16262;color:#FFF;padding:5px 10px;margin-right:5px;
	border-radius:25px;
	-moz-lborder-radius:25px;
	-webkit-border-radius:25px;
	-ms-border-radius:25px;
}
#wrap .questions input {width:70%;border:solid #dbdbdb 1px;background:#dbdbdb}
#wrap .questions li.active input {background:#FFF}
#wrap .btn-submit{clear:both;text-align:center;padding:30px 0;}
#wrap .btn-submit img {width:40%;text-align:center;}
#wrap .bnt-sns {text-align:center;padding:20px 0;}
#wrap .bnt-sns a {padding:0 5px}
#wrap .bnt-sns img {width:36px;}
#wrap .privacy {}
#wrap .privacy .agree {width:92%;margin:0 2%;padding:10px 2%;background:#FFF;line-height:1.6}
#wrap .privacy .agree-tit {text-align:center;padding:20px 0 15px;font-size:1.5em;color:#000;}
#wrap .privacy .agree-chk {text-align:center;padding:10px 0;}
#wrap .privacy .info {width:92%;float:left;margin:0 2%;padding:10px 2%;background:#FFF;color:#000;}
#wrap .privacy .info dt {float:left;width:15%;text-align:center;line-height:30px;margin:5px 0;color:#000;}
#wrap .privacy .info dd {float:left;width:85%;margin:5px 0;}
#wrap .privacy .info span {display: inline-block;}
#wrap .privacy .info span input{width:100%;}
#wrap .privacy .info .w1 {width:100%;}
#wrap .privacy .info .w2 {width:30%;}
#wrap .privacy .info .w3 {width:5%;text-align:center;}

@media only screen and (max-width :500px){
	#wrap .questions input {width:50%;}
	#wrap .questions li,
	#wrap .privacy .agree{font-size:0.938em;}
}

/* iPhones */
@media only screen and (max-width :320px){
}

/* iPads */
@media only screen and (min-width:768px){

}

/* orientation */
@media all and (orientation:landscape){

}

@media only screen and (min-width :320px) and (orientation :landscape){

}

@media only screen and (min-width :768px) and (orientation :landscape){

}