@charset "utf-8";
/* ------------------------------------------------------------ set */
body { color: #221815; font-size: 14px; line-height: 200%; }

a:link { color: #221815; text-decoration: none; }
a:visited { color: #221815; text-decoration: none; }
a:hover,
a:hover img,
input[type="submit"]:hover { color: #111; text-decoration: none; 
	filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8; }

    
input[type="text"],
select,
textaera { border: 1px solid #b5b5b5; }
input[type="submit"] { -webkit-appearance: button; cursor: pointer; padding: 0; border: none; }
.btn { text-align: center; }
.btn a { display: inline-block; *display: inline; *zoom: 1; color: #fff; text-align: center; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.btn.red a { background: url(http://animato-pocket.com/images/index/arw_01.png) 20% center no-repeat #bf5d77; width: 375px; height: 55px; line-height: 55px; font-size: 18px;}


.w100 { width: 100%; height: auto; }
.SP { display: none; }
#main { padding: 50px 0 120px; } 

/* ------------------------------------------------------------ header */
#header { padding: 20px 0; }
#header .logo { display: block; float: left; }
#header .logo img { width: 400px; height: auto; }
#header .h_contact { float: right; margin: 18px auto 0; }
#header .h_contact h1 { float: left; font-size: 13px; color: #a4a4a4; margin: 7px 0 0; }
#header .h_contact div { float: right; margin: 0 0 0 15px; }
#header .h_contact div a { display: inline-block; *display: inline; *zoom: 1; background: #ffae00; font-size: 14px; color: #fff; padding: 7px 35px 5px; border-radius: 3px; -webkit-border-radius: 3px; }

/* ------------------------------------------------------------ nav */
#nav { padding: 0 20px; margin-top: -70px; }
#nav li { float: left; text-align: center; width: 142px; }
#nav ul li:first-child { border-width: 0 1px; }
#nav li a { color: #fff; display: block; padding: 72px 0 0; height: 66px; line-height: 20px; }

#nav li:nth-child(1) a { background: url(../images/common/nav_01.png) no-repeat center top; }
#nav li:nth-child(2) a { background: url(../images/common/nav_02.png) no-repeat center top; }
#nav li:nth-child(3) a { background: url(../images/common/nav_03.png) no-repeat center top; }
#nav li:nth-child(4) a { background: url(../images/common/nav_04.png) no-repeat center top; }
#nav li:nth-child(5) a { background: url(../images/common/nav_05.png) no-repeat center top; }
#nav li:nth-child(6) a { background: url(../images/common/nav_06.png) no-repeat center top; }
#nav li:nth-child(7) a { background: url(../images/common/nav_07.png) no-repeat center top; }

#navigation 	{ display: none; }

/* ------------------------------------------------------------ headline */
.pages h2		{ padding: 115px 0 155px; font-size: 45px; font-weight: bold; color: #e99ecf; }

.bg,
#bread,
#header,
#footer			{ min-width: 1000px; }

.container { width: 100%; max-width: 1000px; min-width: 1000px; margin: 0 auto; }

.full { width: 100%; height: auto; }
/* ------------------------------------------------------------ bread */
#bread { background: #f9f9f9; }
#bread p { padding: 7px 0; font-size: 12px; max-width: 986px; width: 986px; text-indent: 1em; }
#bread p a { color: #ba0101; text-decoration: underline; }

/* ------------------------------------------------------------ bnr */
#bnr { margin: 0 auto 80px; text-align: center; }

/* ------------------------------------------------------------ contact_us */
#contact_us { margin: 0 auto 70px; }
#contact_us .container { background: #fcfaf2; padding: 50px 50px 60px; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
#contact_us h3 { max-width: 1000px; margin: 0 auto; font-size: 22px; color: #fff; background: #e9a6ca; text-align: center; padding: 10px 0; letter-spacing: 2px; }
#contact_us h4 { font-size: 25px; text-align: center; font-weight: bold; margin: 0 auto 40px; }
#contact_us h5 { font-size: 18px; font-weight: bold; text-align: center; margin: 0 auto 10px; }
#contact_us .btn { text-align: center; }
#contact_us .btn a { display: inline-block; *display: inline; *zoom: 1; min-width: 305px; background: url(../images/common/mail.gif) no-repeat 70px center #e9a6ca; font-size: 20px; padding: 10px 0 9px 35px; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
#contact_us.merumaga .btn a { background: url(../images/common/mail.gif) no-repeat 53px center #e9a6ca; }

.dealers { width: 1000px; margin: 0 auto 100px; background: #e9a6ca; padding: 15px 20px 20px; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
.dealers h3 { font-size: 24px; color: #fff; text-align: center; letter-spacing: 2px; padding: 0 0 15px; }
.dealers li { float: left; width: 49%; margin: 0 0 2% 2%; }
.dealers li:nth-child(2n+1) { clear: both; margin: 0 auto; }
.dealers li a img { width: 100%; height: auto; }

/* ------------------------------------------------------------ follow_bnr */
.follow_bnr { position: fixed; width: 100%; bottom: 0; left: 0; min-width: 1000px; }
.follow_bnr a { display: block; float: left; width: calc(100% / 3); text-align: center; }
.follow_bnr a:nth-of-type(1) { background: #e9a7d3; }
.follow_bnr a:nth-of-type(2) { background: linear-gradient(to bottom, #d33183, #a53576); }
.follow_bnr a:nth-of-type(3) { background: #e9a7d3; }
.follow_bnr a span { display: inline-block; *display: inline; *zoom: 1; color: #fff; font-size: 22px; line-height: 100%; }
.follow_bnr a:nth-of-type(1) span { background: url(../images/common/icn_01.png) no-repeat right 16px/38px; padding: 21px 50px 12px 0; }
.follow_bnr a:nth-of-type(2) span { background: url(../images/common/icn_02.png) no-repeat right 13px/31px; padding: 21px 43px 12px 0; }
.follow_bnr a:nth-of-type(3) span { background: url(../images/common/icn_03.png) no-repeat right 17px/33px; padding: 21px 45px 12px 0; }
/* ------------------------------------------------------------ footer */
#footer { background: url(../images/common/bg_01.png) center top; padding: 45px 0 60px; }
#footer #f-nav ul { padding: 20px 0 0; }
#footer #f-nav ul li { float: left; width: calc( (100% - 100px) / 5); margin: 0 0 20px 25px; }
#footer #f-nav ul li:nth-child(5n+1) { clear: both; margin: 0 auto 20px; }
#footer #f-nav ul li a 	{ display: inline-block; *display: inline; *zoom: 1; padding: 0 0 0 25px; background: url(../images/common/arrow_01.png) no-repeat left 4px/13px; font-size: 16px; line-height: 22px; }
#footer .logo { text-align: center; margin: 50px auto; }
#footer .logo img { width: 250px; height: auto; }

#footer #address 		{ background: #e9a6ca; padding: 10px 0; }
#footer address 		{ margin: 0 auto; text-align: center; font-size: 12px; color: #fff; }

/* ------------------------------------------------------------ pager */
#pager 				{ text-align: center; padding: 40px 0; font-size: 14px; }
#pager ul span,
#pager ul .number a { display: inline-block; *display: inline; *zoom: 1; width: 33px; padding: 5px 0; margin: 3px 5px;
 }
#pager ul span 		{ background: #fff; color: #000; }
#pager ul .number a { background: #000; color: #fff; border: 1px solid #000; }

#pick_up { position: fixed; right: 20px; bottom: 20px; }



/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){
html {
	overflow-x: hidden;
}
.vanish,
.PC 		{ display: none; }
.flL,
.flR 		{ float: none; }
.SP 		{ display: block; }

.bg,
.container,
#header,
#footer,
#view,
#view div,
#bread,
#body 		{ min-width: 100px; }

#body 		{ font-size: 16px; }
#bread p 	{ width: auto; }
#body img 	{ display: block; margin: 0 auto; }

.btn.red a { width: 279px; height: 45px; line-height: 45px; font-size: 16px;}
.btn a.news { background: #bf5d77; padding: 5px 30px; }

#view.pages { background: url(../images/common/view_02.jpg) 20% center no-repeat; background-size: cover; min-width: inherit; margin: 60px auto 0; }

#main { padding: 20px 0 50px; }

/* -------------------------- headline */
h1 					{ font-size: 10px; padding: 5px 0 3px; text-align: left; width: 100%;}

.pages div 			{ padding: 40px 0; }
.pages h2			{ padding: 40px 5%; width: 90%; font-size: 22px; }

/* ------------------------------------------------------------ header */
#header { padding: 10px; position: fixed; top: 0; width: 100%; background: #fff; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; z-index: 10; }
#header .logo { width: 150px; margin: 5px 0 0; }
#header .logo img { width: 100%; height: auto; }
#header .h_contact { float: right; margin: 18px auto 0; }
#header .h_contact h1 { float: left; font-size: 13px; color: #a4a4a4; margin: 7px 0 0; }
#header .h_contact div { float: right; margin: 0 0 0 15px; }
#header .h_contact div a { display: inline-block; *display: inline; *zoom: 1; background: #ffae00; font-size: 14px; color: #fff; padding: 7px 35px 5px; border-radius: 3px; -webkit-border-radius: 3px; }


/* ------------------------------------------------------------ contact_us */
#contact_us { margin: 0 5% 40px; }
#contact_us .container { padding: 15px 15px 25px; }
#contact_us h3 { max-width: inherit; margin: 0 auto; font-size: 20px; padding: 5px 0; letter-spacing: 2px; }
#contact_us h4 { font-size: 18px; margin: 0 auto 20px; }
#contact_us h5 { font-size: 16px; margin: 0 auto 10px; }
#contact_us .btn { text-align: center; }
#contact_us .btn a { min-width: inherit; width: 240px; background: url(../images/common/mail.gif) no-repeat 45px center #e9a6ca; font-size: 16px; padding: 10px 0 9px 20px; }
#contact_us.merumaga .btn a { background: url(../images/common/mail.gif) no-repeat 15% center #e9a6ca; }

/* ------------------------------------------------------------ bnr */
#bnr { margin: 0 auto 40px; }
#bnr img,
#animart img { width: 90%; height: auto; }
#animart { padding: 25px 0;}

/* ------------------------------------------------------------ follow_bnr */
.follow_bnr { min-width: inherit; }
.follow_bnr a span { display: none; }
.follow_bnr a img { width: 100%; height: auto; }

/* -------------------------- footer */
#footer { padding: 40px 0 12%; }
#footer #f-nav ul { width: 90%; margin: 0 auto; padding: 0; }
#footer #f-nav ul li { float: none; width: 100%; margin: 0 auto 15px; }
#footer #f-nav ul li:nth-child(5n+1) { clear: inherit; margin: 0 auto 15px; }
#footer #f-nav ul li a 	{ padding: 0 0 0 25px; background: url(../images/common/arrow_01.png) no-repeat left 4px/13px; font-size: 14px; line-height: 22px; }
#footer .logo { text-align: center; margin: 30px auto; }
#footer .logo img { width: 180px; height: auto; }

#pick_up img { width: 100px; height: auto; }

.dealers { width: 90%; margin: 0 auto 100px; padding: 15px 20px 15px; }
.dealers h3 { font-size: 18px; padding: 0 0 10px; }
.dealers li { float: none; width: 100%; margin: 0 auto 15px; }
.dealers li:nth-child(2n+1) { clear: inherit; margin: 0 auto 15px; }

/* -------------------------- groval nav */
#mask { background: #fff; position: fixed; width: 100%; height: 100%; opacity: 0.9; filter: alpha(opacity=90); display: none; -moz-opacity:0.90; top: 0; left: 0; z-index: 99; }
#open_modal { float: right; width: 40px; height: auto; }
#navigation { text-align: center; margin: 0 auto; position: fixed; top: 0;  right: 0; left: 0; margin: 0; z-index: 9999; background: #fff; }
#navigation h3 { color: #554646; font-size: 16px; padding: 10px 0; font-weight: bold; }
#navigation ul { border-top: 1px solid #d0d0d0; overflow: hidden; font-size: 14px; }
#navigation ul li { border-bottom: 1px solid #d0d0d0; text-align: left; }
#navigation ul li a { color: #070707; font-size: 14px; background: #fff url(../images/footer/arw.png) no-repeat 95% 15px; background-size: 15px; padding: 10px 0 10px 20px; display: block;}

#navigation p#close { background: #bf5d77; border-bottom: 1px solid #b2b1b0; padding: 13px 0; text-align: center; cursor: pointer; font-size: 14px; color: #fff;}

@media only screen and (orientation : portrait) { 
	#navigation { position: fixed; top:0; margin: 0 0 0; right: 0; left: 0; }
}