@charset "UTF-8";
/* CSS Document */


/*---リセット---*/
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;}
fieldset, img { border:0; }
address, caption, cite, code, dfn, em,var { font-style:normal; font-weight:normal; }
li { list-style:none; }
caption{ 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%; }
a { text-decoration:none; }
/*--------------*/

.clearfix:after {
visibility:hidden;
height:0;
display: block;
font-size: 0;
content: " ";
clear: both;
}
* html .clearfix             { zoom: 1; }
*:first-child+html .clearfix { zoom: 1; }

html { height:100%;font-size: 6.25%; position:relative;}
body { height:100%; background:#ffffff; text-align:center; color:#4d4d4d;font-size: 14rem; font-family:"FOT-筑紫A丸ゴシック Std R" , 'TsukuARdGothicStd-R','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;line-height:180%; -webkit-text-size-adjust: none; overflow-x: hidden;}

a {	color:#431a12;text-decoration:none;}
img { box-shadow: #000 0 0 0;}
a:hover {color:#e62579;}
a:hover img {opacity:0.6;filter:alpha(opacity=60);-ms-filter: "alpha( opacity=60 )";}
.left{float:left;}
.right{float:right;}
div,div p{text-align: justify;text-justify: inter-ideograph;-ms-text-justify: inter-ideograph;}


#container,.container{width:1100px;margin:0 auto;text-align:left;}
.contents{ padding:0 15px;}

#navi{ width:100%;margin:0 auto; padding:30px 0 20px 0; position:fixed; background-color:#fff; z-index:9999;box-shadow: 0 0 10px #a3a3a3;-moz-box-shadow: 0 0 10px #a3a3a3;-webkit-box-shadow: 0 0 10px #a3a3a3;}
h1{ float:left;}
h1 a{ display:block; background-image:url(../logo.gif); background-repeat:no-repeat; width:224px; height:38px; text-indent:-9999px;}
#navi ul{ float:right;}
#navi li{float:left;margin-left: 30px;}
#navi li.font_m{ font-size:13rem;}
#navi li a{ font-family: 'Open Sans', sans-serif;}

#main{ background-image:url(../main_back.gif); background-position:center top; background-repeat:repeat; text-align:center; height:100%; width:100%; position:relative; z-index:99999;}
#main_img{ height:85%; text-align:center; margin:0 auto;}
#main_img img{ height:100%;}
#main .btn{ text-align:center; padding:15px 0 0 0;}


#concept h3,#character h3,#story h3,#product h3{ font-weight:600; font-family: 'Open Sans', sans-serif; color:#000; font-size:17rem; text-align:center; margin-bottom:45px;}
#concept{ padding:150px 0 0 0;}
#concept .txt1{ color:#e62579; text-align:center; font-size:24rem; font-weight:bold;line-height:150%;}
#concept .txt2{ text-align:center; padding:20px 0 40px 0;}

#character{ padding:150px 0 0 0;}
#chara1{ background-color:#f990b1; margin-bottom:3px;}
#chara2{ background-color:#ffe866; margin-bottom:3px;}
#chara3{ background-color:#c7ed76; margin-bottom:3px;}
#chara4{ background-color:#e9ead9; margin-bottom:3px;}
#chara5{ background-color:#d59fcd; margin-bottom:3px;}
#chara6{ background-color:#a1846b; margin-bottom:3px;}
#character dl{ width:530px;}
#character dt{ float:left; width:250px;}
#character dd{ padding:50px 0 20px 250px;}
#character h4{ font-size:18rem; font-weight:bold; margin-bottom:10px;}
#character h4 span{ font-size:15rem; font-weight:normal;}
#character p{}
#character img{ line-height:0; vertical-align:bottom;}
#chara1 h4,#chara1 p,#chara6 h4,#chara6 p{ color:#fff;}
#chara2 h4,#chara2 p{ color:#c07b04;}
#chara3 h4,#chara3 p{ color:#439f11;}
#chara4 h4,#chara4 p{ color:#444444;}
#chara5 h4,#chara5 p{ color:#a0216c;}

#story{ background-image:url(../story_back.jpg) ;background-position:center bottom; background-repeat:no-repeat; background-color:#f6f5e1; padding:150px 0 100px 0;}
.flexslider{ margin-left:110px;}

#product{ padding:150px 0 25px 0;}
#product .txt1{ text-align:center; font-size:18px; color:#000;}
#product li h4{ border-bottom:1px dotted #c3c3c3; text-align:left; font-weight:bold; font-size:15rem; padding:12px 0;}
#product li p{ border-bottom:1px dotted #c3c3c3; padding:8px 0;}
#product { position: relative; overflow: hidden;}
#product ul { position: relative; left: 50%; float: left;}
#product ul li { position: relative; left: -50%; float: left; padding:25px 10px 0 10px;}
#product .image{ text-align:center;}
#product .image img{ vertical-align:bottom;}
#product #caution{ clear:both;font-size:12rem; line-height:140%;}
#product #caution dl{}
#product #caution img{ margin-top:5px;}
#product #caution dt{ float:left; padding:0 0 0 25px;}
#product #caution dd{ padding:0 0 0 165px; }

#product .amazon-b{ text-align:left;  border:none; padding-top:10px;}


#info{ background-color:#e62579; padding:35px 0;}
#info .left{
	background-color:#fff;
	width:150px;
	height:130px;
}
#info h3{ font-size:18rem; color:#e62579;font-weight:600; font-family: 'Open Sans', sans-serif; text-align:center; padding:24px 0 0 0;}
#info .right{
	padding:10px 0 0 40px;
	float:left;
}
#info dl{ padding:0 0 10px 0;}
#info dt{ color:#fff; float:left;}
#info dd{ color:#fff; padding:0 0 0 100px;}

#tenji{ padding:150px 0 65px 0;}
#tenji h3{ font-size:40rem; color:#000; line-height:130%; margin-bottom:20px;}
#tenji h3 span{ font-size:16rem;}
#tenji p{ padding:7px 0 10px;}
#tenji p.txt1{ font-weight:bold; color:#000; font-size:20rem; line-height:130%; text-align:left;}
#tenji p.txt1 span{ font-size:16rem;}

#contact{ background-color:#a3a3a3; padding:35px 0 25px 0; margin-top:100px;}
#contact h3{ color:#fff; font-size:15rem; text-align:center;}
#contact h3 p{ font-size:18rem;font-weight:600; font-family: 'Open Sans', sans-serif; padding-bottom:10px; text-align:center;}
#form{ background-color:#f0f0f0; padding:40px 0 45px 0;}
#form h4{ border-bottom:2px solid #d1d1d1; padding:0 0 8px 0; color:#000; margin-bottom:20px;}
#form .tel{ color:#000; font-size:16rem; text-align:left; font-weight:bold; padding-bottom:7px;}
#form .time{ color:#000;}
#form .add{ padding:35px 0 15px 0;}
#form .left,#form .right{ width:47%;}
.googleMaps iframe{ height:245px; width: 100%;}
.f_box{}
.f_box dt{float:left;width:120px;padding:5px 0 15px 0;}
.f_box dd{padding:0 0 15px 0;width:370px;float:left;}
input,textarea{	font-style:normal;padding:5px;font-size:100%;color: #4d4d4d;border:1px solid #d7d7d7;}
.table_btn{text-align:center;}
input.fbtn{width:200px; border:0; background-color:#a48e71; color:#fff; text-align:center;}

#footer{ padding:55px 0 30px 0;}
#footer h4{ float:left; font-size:11rem; color:#494949; padding-top:10px;}
#footer h4 img{ vertical-align:text-bottom}
#footer .right img{ margin-left:7px;}
#footer br{ display:none;}
#sp_logo,.nonbr,header{ display:none;}

@media screen and (max-width: 1100px) {
#main_img{ height:auto; width:100%;}
#main_img img{ height:auto; width:100%;}
#container,.container{ width:100%;}

#navi{ display:none;}
header{ display:inherit;}
#character .right{ float:none;}
#character dl{ width:100%;}
#character dt{ width:250px;}
#character .right img{ width:100%; margin-bottom:15px;}
.flexslider{ margin-left:0;}

#story{ overflow:hidden;}
#product li h4{ padding:0 0 12px 0;}
#product ul { position: relative; left:0; float:none;}
#product ul li { position: relative; left:0; float: none; padding:25px 0 0 0; margin:0 auto;}
#product #caution dl{ margin-top:30px;}
#product #caution dt{ padding:0;}
#info .left{ background-color:#fff; width:100%; height:auto;}
#info h3{ padding:10px 0;}
#info .right{ padding:10px 0 0 0;}
#tenji .right{ float:none; text-align:center;}
#tenji .right img{ width:80%;}
#form .left,#form .right{ width:100%; float:none;}
#form .left{ margin-bottom:50px;}
.f_box{margin-right:0;	padding:10px 0 0 10px;}
.f_box dt{float:none;padding:0;width:100%;}
.f_box dd{float:none;padding:0 0 15px 0;width:95%;}
input.fbtn{width:200px;height:41px;}
input,textarea{font-size:16px;}
}

@media screen and (max-width: 480px) {
#concept,#character,#product,#tenji,#contact,#story{ padding:50px 0 30px 0;}
#main .btn{ text-align:center; padding:30px 0 30px 0;}
#character .left,#character .right{ float:none;}
#character dt{ width:100%; text-align:center;}
#character dt img{ width:80%;}
#character dd{ padding:10px 0; float:none;}
#character dd br{ display:none;}

#product #caution dt{ float:none;}
#product #caution dd{ padding:0; }

#tenji .right img{ width:100%;}
#tenji h3{ font-size:26rem;}
#tenji h3 span{ font-size:14rem;}
.googleMaps iframe{ height:200px;}
#footer .right{ text-align:center; float:none; width:100%;}
#footer h4{ text-align:left; margin-top:20px;}
#footer br{ display:inherit;}
.nonbr{ display:inherit;}
}