@charset "UTF-8";

/* CSS Information =======================
(C) エムティーアイ
------------------------------------------
Table of Contents:
 +reset
 +base
 +header
 +footer
 +clearfix
========================================*/

/*========================================
 +reset
========================================*/
html,body,div,h1,h2,h3,h4,h5,h6,p,blockquote,q,pre,table,caption,colgroup,col,tbody,thead,tfoot,tr,th,td,ul,ol,li,dl,dt,dd,form,fieldset,legend,label,input,span,a,img,em,ins,del,cite,abbr,sup,sub,dfn,code,var,samp,kbd,object,script,noscript,style,iframe,embed,param,map,area,menu,hr,address,small,strong,i,b,article,aside,figure,freefooter,header,hgroup,nav,section,figcaption,time,video,audio,mark,ruby,rt,rp,bdo,source,canvas,details,summary,command,datalist,keygen,output,progress,meter {
	margin: 0;
	padding: 0;
	font-size: 100%;
	word-wrap: break-word;
}
address,article,aside,figure,figcaption,footer,header,hgroup,hr,legend,menu,nav,	section,summary {
	display: block;
}
ul,ol {
	list-style-type: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a img {
	border: none;
}
img {
	vertical-align: top;
}
[hidden] {
	display: none;
}
mark {
	background: none;
}
input {
	opacity: 1;
}

/*========================================
 +base
========================================*/
body {
	background: url(/img/body/bg_01.jpg) left top repeat;
	color: #646464;
	font-family: sans-serif;
	line-height: 1.5;
	-webkit-text-size-adjust: none;
}
.portrait {
	font-size: 12px;
}
.landscape {
	font-size: 18px;
}

a,
input {
	color: #000;
	-webkit-tap-highlight-color: rgba(00,33,99,0.3);
	text-decoration: none;
}
img,
input[type="image"] {
	-moz-transform-origin: 0 0;
	-moz-transform: scale(.5);
	zoom: .5;
}
h1,h2,h3,h4,h5,h6 {
	line-height: 1.2;
}
::-webkit-input-placeholder { font-weight: bold; }

/*========================================
 +header
========================================*/
#header {
	position: relative;
	padding: 15px 0;
	background: url(/img/module/mosaic_p_01.png) left top repeat;
}
#header .si {
	width: 194px;
	margin: 0 0 10px 10px;
	text-align: center;
}
#nav {
	margin: 0 0 12px;
}
#nav.item04 {
	background: url(/img/header/pic_01.png) 221px top no-repeat;
	-webkit-background-size: 79px 174px;
	background-size: 79px 174px;
}
#nav.item03 {
	background: url(/img/header/pic_01.png) 221px bottom no-repeat;
	-webkit-background-size: 79px 174px;
	background-size: 79px 174px;
}
#nav.item02 {
	background: url(/img/header/pic_02.png) 221px bottom no-repeat;
	-webkit-background-size: 79px 110px;
	background-size: 79px 110px;
}
#nav.trialBtn {
	background:221px bottom no-repeat;
	-webkit-background-size: 79px 110px;
	background-size: 79px 110px;
}
#nav li {
	width: 207px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0 0 8px;
	padding: 8px 3px 12px 10px;
	-webkit-border-radius: 0 10px 10px 0;
	border-radius: 0 10px 10px 0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(199,82,105,.6)), color-stop(3%,rgba(235,109,134,.6)), color-stop(20%,rgba(242,155,172,.6)), color-stop(80%,rgba(255,193,205,.6)), color-stop(97%,rgba(255,231,236,.6)), color-stop(100%,rgba(254,247,248,.6)));
	background: linear-gradient(rgba(199,82,105,.6) 0%, rgba(235,109,134,.6) 3%, rgba(242,155,172,.6) 20%, rgba(255,193,205,.6) 80%, rgba(255,231,236,.6) 97%, rgba(254,247,248,.6) 100%);
}
#nav .ez {
	padding: 3px 3px 17px 10px;
}
#nav .ez {
	margin: 0;
}
#nav .ez span {
	position: absolute;
	width: 207px;
	padding: 2px 0 0;
	color: #646464;
	text-align: center;
	line-height: 1;
}
#nav a,
#nav span {
	display: block;
}
#header .topics {
	padding: 0 10px;
}
#header .topics a {
	display: block;
	position: relative;
	padding: 0 0 0 11px;
	color: #e56a83;
	text-decoration: underline;
}
#header .topics a:before {
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	width: 5px;
	height: 5px;
	margin-top: -4px;
	border-top: solid 2px #e56a83;
	border-right: solid 2px #e56a83;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	content: "";
}
#header .topicsTrial {
	display: block;
	position: relative;
	padding: 0 0 10 11px;
	color: #e56a83;
	font-size: 16px;
}
#login {
	position: absolute;
	top: 15px;
	right: 8px;
	width: 98px;
	text-align: center;
}
#login02 {
	text-align: center;
	padding: 0 10%;
}
#login .login a,
#login02 .login a  {
	display: block;
}
#login .btn:before {
	display: block;
	margin: 0 4px 0 0;
	vertical-align: text-bottom;
	content: url(/img/module/icon_login_01.png);
	zoom: .5;
}
#login02 .btn:before {
	display: block;
	margin: 0 4px 0 0;
	vertical-align: text-bottom;
	content: url(/img/module/icon_login_01.png);
}
#login .note {
	margin: 5px 0 0;
}
#login .note a {
	color: #e56a83;
	text-decoration: underline;
}

#header2 {
	padding: 10px;
}
#header2 .si {
	float: left;
	padding: 6px 0 0;
}
#nav02 {
	float: right;
}
#nav02 a {
	color: #f1b0bd;
	text-decoration: none;
}
#nav02 a.current {
	color: #e56a83;
}
#nav02 a:before {
	margin: 0 3px 0 0;
	content: "●";
}

/*========================================
 +footer
========================================*/
#freefooter {
	padding: 12px 12px 0;
	background: #f9dbe1;
}
#freefooter .fnav {
	margin: 0 0 12px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	background: #fff;
}
#freefooter .fnav .ttl {
	padding: 8px 0;
	-webkit-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
	color: #fff;
	text-align: center;
}
#freefooter .fnav.contents .ttl {
	background: #eb8a9e;
}
#freefooter .fnav.user .ttl,
#freefooter .fnav.docomo .ttl {
	background: #a1a0a0;
}
#freefooter .fnav ul {
	-webkit-border-radius: 0 0 4px 4px;
	border-radius: 0 0 4px 4px;
}
#freefooter .fnav.contents ul {
	border: 1px solid #eb8a9e;
	border-top: none;
}
#freefooter .fnav.user ul,
#freefooter .fnav.docomo ul {
	border: 1px solid #a1a0a0;
	border-top: none;
}
#freefooter .fnav a {
	display: block;
	position: relative;
	padding: 12px 30px 12px 14px;
	color: #0f3677;
	line-height: 1;
	text-decoration: none;
}
.portrait #freefooter .fnav a {
	font-size: 16px;
}
.landscape #freefooter .fnav a {
	font-size: 24px;
}
#freefooter .fnav.contents a {
	border-bottom: 1px solid #eb8a9e;
}
#freefooter .fnav.user a,
#freefooter .fnav.docomo a {
	border-bottom: 1px solid #a1a0a0;
}
#freefooter .fnav li:last-child a {
	border-bottom: none;
}
#freefooter .fnav a:before {
	display: block;
	position: absolute;
	top: 50%;
	right: 10px;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	content: "";
}
#freefooter .fnav.contents a:before {
	border-top: solid 2px #eb8a9e;
	border-right: solid 2px #eb8a9e;
}
#freefooter .fnav.user a:before,
#freefooter .fnav.docomo a:before {
	border-top: solid 2px #a1a0a0;
	border-right: solid 2px #a1a0a0;
}
#freefooter .utility {
	margin: 0 -12px 10px;
	text-align: center;
}
#freefooter .utility li {
	display: inline-block;
	margin: 0 0 0 2px;
	padding: 0 0 0 4px;
	border-left: 1px solid #0f3677;
}
#freefooter .utility li:first-child {
	margin: 0;
	padding: 0;
	border: none;
}
#freefooter .utility a {
	color: #0f3677;
	text-decoration: underline;
}
#freefooter .copyright a {
	display: block;
	margin: 0 -12px;
	padding: 6px 0;
	background: #eb8a9e;
	color: #fff;
	text-align: center;
	text-decoration: none;
}

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