@charset "UTF-8";
/***********************
 * Neutralize Any Tags
 * Copyright (c) 2008, Yahoo! Inc. All rights reserved.
 * Code licensed under the BSD License:
 * http://developer.yahoo.net/yui/license.txt
 * version: 2.5.2
 ***********************/
html{color:#3b3b3b; background:#fff;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}

li{ list-style:outside; margin-left:20px; margin-bottom:10px;}
ul{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
sup {vertical-align:text-top;}
sub {vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
input,textarea,select{*font-size:100%;}
legend{color:#000;}
table{font-size:inherit;font:100%;}
pre,code,kbd,samp,tt{font-family:monospace;*font-size:100%;line-height:100%;}
body{font:13px/1.4 "Lucida Grande","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","?��?�� ?��ゴシ�?ク",Helvetica,Arial,Verdana,sans-serif;*font-size:small;*font:x-small; background-image:url(../img/bg.gif);}
/*body *{line-height:1.4;}*/


#header{
  text-align:left;
  background-color:#FFFFFF;
  height: 32px;
}
#header .sns{ float:right; width:500px; margin-top:10px; text-align:right;}

#wrapper {
  width: 800px;
  margin: 0 auto;
  /*text-align:center; */ 
}

#main{
  width: 100%;
  clear: both;
}

.clear{
clear:both;
}



/* kyolic */

.box01{
  width: 100%;
  background-color:#fd030c;
  height: 70px;
  position: relative;
}
.box01 p{
  position: absolute;
  width: 110px;
  height: 36px;
  top:0; bottom: 0;
  left:50px;
  margin: auto;  
}
.box02{
  padding: 0;
}

.box03{
  width: 100%;
  background-color:#fd030c;
  position: relative;
  height: 95px;
  padding: 95px 0 0;
}

p.kyolic_txt{
  position: absolute;
  width: 702px;
  height: 111px;
  left: 1px; right: 0;
  top:-61px;
  margin: auto;
}

ul.kyolic_list{
  width: 700px;
  margin: 0 auto;
	text-align: center;

}
ul.kyolic_list li{
  margin: 0 auto;
  width: 220px;
  list-style: none;
}



/* ボタン */
.button {
	position: relative;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+68,dedede+100 */
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 68%, #dedede 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #ffffff 68%,#dedede 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #ffffff 68%,#dedede 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dedede',GradientType=0 ); /* IE6-9 */
  border-radius: 10px;
  border: solid #fff 1px;
  -webkit-transition: none;
  transition: none;
  box-shadow: 2px 5px 1px rgba(0,0,0,0.3);
  width: 100%;
  height: 60px;
  display: block;
  text-align: center;
  margin: 0;
  box-sizing: border-box;
  font-size: 16px;
  float: right;
}
.button a{
  color: #eb6a86;
  font-weight: bold;
  letter-spacing: 1px;
  display:block;
  text-decoration: none;
}
.button:hover {
	box-shadow: 2px 5px 1px rgba(0,0,0,0.3);
	text-decoration:none;
}
.button:active {
	top: 3px;
	box-shadow: none;
}

.button2 {
	position: relative;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+68,dedede+100 */
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 68%, #dedede 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #ffffff 68%,#dedede 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #ffffff 68%,#dedede 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dedede',GradientType=0 ); /* IE6-9 */
  border-radius: 10px;
  border: solid #fff 1px;
  -webkit-transition: none;
  transition: none;
  box-shadow: 2px 5px 1px rgba(0,0,0,0.3);
  width: 100%;
  height: 60px;
  display: block;
  text-align: center;
  margin: 0;
  box-sizing: border-box;
  font-size: 16px;
  float: right;
}
.button2 a{
  color: #ea272f;
  font-weight: bold;
  letter-spacing: 1px;
  display:block;
  text-decoration: none;
}
.button2:hover {
	box-shadow: 2px 5px 1px rgba(0,0,0,0.3);
	text-decoration:none;
}
.button2:active {
	top: 3px;
	box-shadow: none;
}

.button2:after {
    position: absolute;
    top: 17px;
    right: 10px;
    content: "\025b6";
    color: #ea272f;
}

.button_link a {
    color: #fff;
}
.white {
    color: #fff;
}

.t_bold {
    font-size: 18px;
    font-weight: bold;
}

.height60{line-height: 60px;}
.pdt10 { padding-top: 8px;}


/* q10 */
.box_q10_01 {
    width: 100%;
    background-color: #291f88;
    height: 70px;
    position: relative;
}


.box_q10_01 p{
    position: absolute;
    width: 110px;
    height: 36px;
    top: 0;
    bottom: 0;
    left: 48px;
    margin: auto;
}


.box_q10_02 {
		padding: 20px 0 0 0;
    background-color: #fd030c;
    height: 90px;
}

.kyolic_q10_list {
    width: 300px;
    margin: 0 auto;
    /*padding: 0 0 11px 0;*/
}

ul.kyolic_q10_list li{
		list-style-type:none;
		float:left;
		margin: 0 20px 0 0;
  	width: 340px;
}

ul.kyolic_q10_list li:last-child{
		margin: 0;
}

ul.kyolic_q10_list li p a {
		font-family: "AXIS Std";
}

.height58{
		line-height: 58px;
}

ul.kyolic_q10_list li:nth-child(n+3){
		width:220px;
		margin:20px 20px 0 0;
}

ul.kyolic_q10_list li.last{
		margin-right: 0;
}

.box_q10_03 {
		width: 100%;
		background-color:#eb6a86;
		position: relative;
    padding: 80px 0 20px;
}

.box_q10_03_2 {
		width: 100%;
		background-color:#fd030c;
		position: relative;
		height: 60px;
    padding: 80px 0 0;
}
.box_q10_04 {
    width: 100%;
    background-color:#fd030c;
    position: relative;
    padding: 80px 0 0;
}
ul.kyolic_q10_list2 {
    width: 700px;
    margin: 0 auto 30px;
    /*padding: 0 0 11px 0;*/
}

ul.kyolic_q10_list2 li{
    list-style-type:none;
    float:left;
    margin: 0 20px 0 0;
    width: 340px;
}

ul.kyolic_q10_list2 li:last-child{
    margin: 0;
  padding-top: 5px;
}
ul.kyolic_q10_list2 li:nth-of-type(3){
    padding-top: 10px;
}

ul.kyolic_q10_list2 li p a {
    font-family: "AXIS Std";
}


ul.kyolic_q10_list2 li:nth-child(n+3){
    width:220px;
    margin:20px 20px 0 0;
}

ul.kyolic_q10_list2 li.last{
    margin-right: 0;
}

p.consumer {
	margin:0 0 0 50px;
}

p.consumer a{
	font-size:14px;
	font-family: "AXIS Std";
	color:#ffffff;
}

.box04 {
    text-align: center;
    padding: 40px 0;
}

.footer {
    background: url("../img/footer.png") no-repeat;
    height: 80px;
    padding: 40px 0 0 0;
}

.button01 {
	position: relative;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+68,dedede+100 */
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top, #ffffff 68%, #dedede 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #ffffff 68%,#dedede 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #ffffff 68%,#dedede 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dedede',GradientType=0 ); /* IE6-9 */
  border-radius: 10px;
  border: solid #fff 1px;
  -webkit-transition: none;
  transition: none;
  box-shadow: 2px 5px 1px rgba(0,0,0,0.3);
  width: 220px;
  height: 40px;
  display: block;
  text-align: center;
  margin: 0 auto;
  box-sizing: border-box;
  font-size: 16px;
}
.button01 a{
  color: #ea272f;
  font-weight: bold;
  letter-spacing: 1px;
  display:block;
  text-decoration: none;
}
.button01:hover {
	box-shadow: 2px 5px 1px rgba(0,0,0,0.3);
	text-decoration:none;
}
.button01:active {
	top: 3px;
	box-shadow: none;
}

.height40 {
    line-height: 40px;
}




#header_m {
    background:url("../img/head.png") no-repeat;
    height: 80px;
    padding: 17px 0 35px 0;
}

.inner {
		width:704px;
		margin:0 auto;
}

.material_box{
text-align:center;
margin: -63px 0 60px 0;
}

.material_box_first{
padding:0 0 15px 0;
}

.material_box_second{
padding:0 0 37px 0;
}

.material_box_third{
padding:0 0 25px 0;
}




.mb30 {
	margin-bottom: 30px;
}

.pb0 {
	padding-bottom: 0;
}

.pt20 {
	padding-top: 20px;
}

.mt0 {
	margin-top: 0;
}



/*----------------------------------------------------
	float set
----------------------------------------------------*/
.left { float: left!important; margin-top: -8px;}
.right { float: right!important;}

/*----------------------------------------------------
	text align set
----------------------------------------------------*/
.txa_l { text-align: left!important; }
.txa_c { text-align: center!important;}
.txa_r { text-align: right!important; }

/*----------------------------------------------------
	clearfix
----------------------------------------------------*/
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
}