@charset "utf-8";

html{
	background:#FFF;
}
body, div, dl, dt, dd, ul, ol, li,h1, h2, h3, h4, h5, h6,pre, form, input, textarea,p, th, td {
	margin:0;
	padding:0;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}
img {
	border:0;
}
address, em, strong, th {
	font-style:normal;
	font-weight:normal;
}
li {
	list-style:none;
}
th {
	text-align:left;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
input,textarea,select {
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
}
input,textarea,select {
	*font-size:100%;
}


a {
	color:#96204C;
}

a:hover {
	color:#1972B9;
}

/*==============================================
	reset font
===============================================*/
body {
	font:14px/1.231 arial,helvetica,clean,sans-serif;
	*font-size:small; /* for IE */
	*font:x-small; /* for IE in quirks mode */
	font-family:Arial, Helvetica, Verdana, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}
select,input,button,textarea {
	font:99% arial,helvetica,clean,sans-serif;
}
table {
	font-size:inherit;
	font:100%;
}


/*	ClearFix
=======================================*/
.clearfix:after {
	content:"";
	display:block;
	height:0;
	clear:both;
	visibility: hidden;
}
.clearfix {
	display:inline-block;
}
/* Hides from IE-mac \*/
	* html .clearfix {height: 1%;}
	.clearfix {display: block;}
/* End hide from IE-mac */


/*-------------------------------------------------------------------
* ピクセル　％  文字サイズ相対指定は%で行う。
---------------------------------------------------------------------
10px   77  	% 
11px   85  	%
12px   93  	%
13px  100  	%
14px  108  	%
15px  116  	%
16px  123.1	% 
17px  131  	%
18px  138.5	% 
19px  146.5	% 
20px  153.9	% 
21px  161.6	% 
22px  167  	%
23px  174  	%
24px  182  	%
25px  189  	%
26px  197  	%
*/


/*==================================================
  common
==================================================*/
#wrapper {
	margin: 0;
	width: 100%;
	position: relative;
}

/*==============================================
	headmenu
===============================================*/
#wrapper #headermenu {
	width: 100%;
	height: 90px;
}

#wrapper #headermenu #hnav {
	position: relative;
	width: 980px;
	height: 90px;
	margin: 0 auto;
}

#wrapper #headermenu li {
	float: left;
	position: absolute;
}

#wrapper #headermenu .logo {
	width: 240px;
	top: 16px;
	left: 0px;
}
#wrapper #headermenu .logo img {
	width: 240px;
}
#wrapper #headermenu .logotxt {
    display:table;
	width: 400px;
	height: 50px;
	top: 18px;
	left: 260px;
	border-left: solid 1px #999;
}
#wrapper #headermenu .logotxt p {
    display:table-cell;
	font-size:13px;
	padding-left:14px;
    vertical-align:middle;
    line-height:1.4em;
}

#wrapper #headermenu .bt_mail {
	width: 190px;
	height: 50px;
	top: 16px;
	right: 0;
}
#wrapper #headermenu .bt_mail a {
	display: block;
	width: 190px;
	height: 50px;
	line-height: 50px;
	text-align: center; 
	font-weight:bold;
	margin: 0;
	text-decoration: none;
	color:#FFF;
	background:#F10E74;
	border-radius: 6px;
	 -webkit-border-radius: 6px;
	 -moz-border-radius: 6px;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}

#wrapper #headermenu .bt_mail a:hover {
	background:#33B295;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}
#wrapper #contents .caution_bottom{
	font-size: 12px;
width: 860px;
margin: 0 auto 5px;
text-align: right;
}

#wrapper #contents .btn-contact{
	display: inline-block;
	float: right;
	margin-right: 70px;
}
#wrapper #contents .btn-contact .bt_mail {
	width: 190px;
	height: 50px;
	top: 16px;
	right: 0;
	margin-top: 0;
	margin-bottom: 30px;
}
#wrapper #contents .btn-contact .bt_mail a {
	display: block;
	width: 190px;
	height: 50px;
	line-height: 50px;
	text-align: center; 
	font-weight:bold;
	margin: 0;
	text-decoration: none;
	color:#FFF;
	background:#F10E74;
	border-radius: 6px;
	 -webkit-border-radius: 6px;
	 -moz-border-radius: 6px;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}

.btn-contact .bt_mail a:hover {
	background:#33B295;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}



/*==============================================
	footermenu
===============================================*/

#wrapper #footermenu {
	position:relative;
	width: 100%;
	height: 140px;
	font-size:85%;
	border-top: solid 1px #ccc;
}

#wrapper #footermenu #fnav {
	width: 801px;
	margin: 0 auto;
	padding-top:26px;
}

#wrapper #footermenu li {
	float: left;
	width:160px;
	padding:0 20px;
}

#wrapper #footermenu li img {
	width:160px;
}

#wrapper #footermenu li a:hover img{
    filter: alpha(opacity=70);
    -moz-opacity:0.7;
    opacity:0.7;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}

#wrapper #footermenu .copy {
	position:absolute;
	width:100%;
	height:30px;
	line-height:30px;
	font-size:12px;
	text-align:center;
	color:#FFFFFF;
	background-color:#000;
	bottom:0;
}

/*==============================================
	glonavi
===============================================*/
#wrapper #contentrmenu {
	width: 100%;
	background: #000;
	height: 50px;
	margin: 0;
}

#wrapper #contentrmenu #cnav {
	position: relative;
	width: 986px;
	height: 50px;
	margin: 0 auto;
}

#wrapper #contentrmenu li {
	float: left;
}

#wrapper #contentrmenu li a {
	display: block;
	width: 149px;
	height: 50px;
	line-height: 50px;
	margin: 0;
	color:#FFF;
	font-weight: bold;
	text-align: center; 
	text-decoration: none;
	border-left: solid 1px #FFF;
}

#wrapper #contentrmenu .off {
	display: block;
	width: 149px;
	height: 38px;
	padding-top:12px;
	margin: 0;
	color:#666;
	font-weight: bold;
	text-align: center; 
	text-decoration: none;
	border-left: solid 1px #FFF;
}
#wrapper #contentrmenu .off span {
	color:#ccc;
	font-size:10px;
}

#wrapper #contentrmenu li a:hover {
	color:#FFF;
	background:#33B295;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}

#wrapper #contentrmenu li .ord {
	height: 42px;
	padding-top:8px;
	line-height: 17px;
}

#wrapper #contentrmenu li .ord {
	height: 42px;
	padding-top:8px;
	line-height: 17px;
}

#wrapper #contentrmenu #cnav .on a {
	color:#FFF;
	background:#33B295;
	background-position: 10px 50%;
	background-repeat: no-repeat;
}

#wrapper #contentrmenu .top a {
	width: 78px;
	height: 30px;
	line-height: 30px;
	font-size:11px;
	padding-top:20px;
	background-image: url(../images/shared/sp_home.png);
	background-position: 50% 10px;
	background-repeat: no-repeat;
}

#wrapper #contentrmenu .top a:hover {
	background:#33B295;
	background-image: url(../images/shared/sp_home.png);
	background-position: 50% 10px;
	background-repeat: no-repeat;
}

#wrapper #contentrmenu .topon a {
	width: 78px;
	height: 30px;
	line-height: 30px;
	font-size:11px;
	padding-top:20px;
	background:#33B295;
	background-image: url(../images/shared/sp_home.png);
	background-position: 50% 10px;
	background-repeat: no-repeat;
}

#wrapper #contentrmenu .topon a:hover {
	background:#33B295;
	background-image: url(../images/shared/sp_home.png);
	background-position: 50% 10px;
	background-repeat: no-repeat;
}

#wrapper #contentrmenu .end a {
	border-right: solid 1px #FFF;
	width: 148px;
}

/*==============================================
	contentbass
===============================================*/

#wrapper #pan {
	width: 974px;
	height: 40px;
	line-height: 40px;
	margin: 0 auto;
	font-size:12px;
}

#wrapper #pan a {
	color:#DC4D92;
}

#wrapper #pan a:hover {
	color:#999;
}

#wrapper #pan .next {
	margin:0 10px;
}


#wrapper #contents {
	width: 980px;
	margin: 40px auto 30px;
}

#wrapper #contents #secondary {
	float:left;
	width: 250px;
	margin: 0;
}

#wrapper #contents #secondary #snav {
	float: left;
	overflow:hidden;
	margin-bottom:20px;
}

#wrapper #contents #secondary #snav li a {
	display: block;
	width: 224px;
	height: 32px;
	line-height: 32px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:26px;
	border-bottom: solid 1px #FFF;
	background-color:#AAA;
	background-image: url(../images/shared/side_main.png);
	background-position: 8px 50%;
	background-repeat: no-repeat;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}

#wrapper #contents #secondary #snav li a:hover {
	background-color:#33B295;
	background-image: url(../images/shared/side_main.png);
	background-position: 12px 50%;
	background-repeat: no-repeat;
}

#wrapper #contents #secondary #snav .blaw a {
	background-color:#AAA;
	background-image: url(../images/shared/side_blank.png);
	background-position: 6px 50%;
	background-repeat: no-repeat;
}

#wrapper #contents #secondary #snav .blaw a:hover {
	background-color:#33B295;
	background-image: url(../images/shared/side_blank.png);
	background-position: 6px 50%;
	background-repeat: no-repeat;
}

#wrapper #contents #secondary #snav .on a {
	background-color:#000;
	background-image: url(../images/shared/side_main.png);
	background-position: 12px 50%;
	background-repeat: no-repeat;
}

#wrapper #contents #secondary #snav .tow a {
	display: block;
	width: 224px;
	height: 42px;
	line-height: 18px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-top:8px;
	padding-left:26px;
	border-bottom: solid 1px #FFF;
	background-color:#AAA;
	background-image: url(../images/shared/side_blank.png);
	background-position: 6px 50%;
	background-repeat: no-repeat;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}


 #wrapper #contents #secondary #snav .sub.snav_sub_umekita,
 #wrapper #contents #secondary #snav .sub.snav_sub_knowledge {
 	height: 29px;
	overflow: hidden;
 }

#wrapper #contents #secondary #snav .sub a {
	display: block;
	width: 212px;
	height: 28px;
	line-height: 28px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:38px;
	border-bottom: solid 1px #FFF;
	background-color:#BBB;
	background-image: url(../images/shared/side_sub.png);
	background-position: 22px 50%;
	background-repeat: no-repeat;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}
#wrapper #contents #secondary #snav .sub a:hover {
	background-color:#33B295;
	background-image: url(../images/shared/side_sub.png);
	background-position: 26px 50%;
	background-repeat: no-repeat;
}



#wrapper #contents #secondary #snav .sub2 a {
	display: block;
	width: 240px;
	height: 28px;
	line-height: 28px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:10px;
	border-bottom: solid 1px #FFF;
	background-color:#BBB;
	background-image:none;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}
#wrapper #contents #secondary #snav .sub2 a:hover {
	background-color:#33B295;
	background-image:none;
}

#wrapper #contents #secondary #snav .sub2on a {
	display: block;
	width: 240px;
	height: 28px;
	line-height: 28px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:10px;
	border-bottom: solid 1px #FFF;
	background-color:#33B295;
	background-image:none;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}
#wrapper #contents #secondary #snav .sub2on a:hover {
	background-color:#33B295;
	background-image:none;
}



#wrapper #contents #secondary #snav .subon a {
	display: block;
	width: 212px;
	height: 28px;
	line-height: 28px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:38px;
	border-bottom: solid 1px #FFF;
	background-color:#33B295;
	background-image: url(../images/shared/side_sub.png);
	background-position: 26px 50%;
	background-repeat: no-repeat;
}
#wrapper #contents #secondary #snav .subon a:hover {
	background-color:#33B295;
	background-image: url(../images/shared/side_sub.png);
	background-position: 26px 50%;
	background-repeat: no-repeat;
}

#wrapper #contents #secondary #snav .hiroba {
	display: block;
	width: 224px;
	height: 32px;
	line-height: 32px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:26px;
	border-bottom: solid 1px #FFF;
	background-color:#AAA;
	background-image: url(../images/shared/side_main.png);
	background-position: 10px 50%;
	background-repeat: no-repeat;
    -webkit-transition: background 0.3s ease-in-out;
       -moz-transition: background 0.3s ease-in-out;
         -o-transition: background 0.3s ease-in-out;
            transition: background 0.3s ease-in-out;
	cursor: pointer;
}
#wrapper #contents #secondary #snav .hiroba:hover{
	background-color: #33B295;
}
#wrapper #contents #secondary #snav .hiroba.open{
	background-image: url(../images/shared/side_hiroba.png);
	cursor: default;
}
#wrapper #contents #secondary #snav .hirobaon {
	display: block;
	width: 224px;
	height: 32px;
	line-height: 32px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:26px;
	border-bottom: solid 1px #FFF;
	background-color:#000;
	background-image: url(../images/shared/side_hiroba.png);
	background-position: 10px 50%;
	background-repeat: no-repeat;
}

#wrapper #contents #secondary #snav .none-submenu {
	display: block;
	width: 224px;
	height: 32px;
	line-height: 32px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:26px;
	border-bottom: solid 1px #FFF;
	background-color:#AAA;
	background-image: url(../images/shared/side_main.png);
	background-position: 8px 50%;
	background-repeat: no-repeat;
    -webkit-transition: 0.3s ease-in-out;
       -moz-transition: 0.3s ease-in-out;
         -o-transition: 0.3s ease-in-out;
            transition: 0.3s ease-in-out;
}

#wrapper #contents #secondary #snav .active-submenu {
	display: block;
	width: 224px;
	height: 32px;
	line-height: 32px;
	margin: 0;
	color:#FFF;
	font-size:13px;
	font-weight:bold;
	text-decoration: none;
	padding-left:26px;
	border-bottom: solid 1px #FFF;
	background-color:#000;
	background-image: url(../images/shared/side_hiroba.png);
	background-position: 10px 50%;
	background-repeat: no-repeat;
}


#wrapper #contents #secondary .medialink,
#wrapper #contents #secondary .showcase {
display: inline-block;
margin: 0;
}


#wrapper #contents #secondary .medialink a,
#wrapper #contents #secondary .showcase a {
	display: block;
	width: 250px;
	height: 48px;
	font-size: 16px;
	line-height: 20px;
	text-align: center; 
	font-weight:bold;
	margin: 20px 0 0;
	text-decoration: none;
	padding-top:12px;
	color:#FFF;
	background:#33B295;
	background-image: url(../images/shared/sp_bon.png);
	background-position: 96% 50%;
	background-repeat: no-repeat;
	border-radius: 10px;
	 -webkit-border-radius: 10px;
	 -moz-border-radius: 10px;
    -webkit-transition: 0.4s ease-in-out;
       -moz-transition: 0.4s ease-in-out;
         -o-transition: 0.4s ease-in-out;
            transition: 0.4s ease-in-out;
}

#wrapper #contents #secondary .medialink a:hover,
#wrapper #contents #secondary .showcase a:hover {
	background:#CDF1E9;
	background-image: url(../images/shared/sp_bon.png);
	background-position: 98% 50%;
	background-repeat: no-repeat;
    -webkit-transition: 0.4s ease-in-out;
       -moz-transition: 0.4s ease-in-out;
         -o-transition: 0.4s ease-in-out;
            transition: 0.4s ease-in-out;
}







#wrapper #contents #primary {
	float:right;
	width: 680px;
	margin: 0;
}

#wrapper #contents .small {
	font-size:11px;
}

.pc {
	display:inline;
}

.sp {
	display:none;
}


#wrapper #contents h1 a {
	display: block;
	float:right;
	width: 200px;
	height: 30px;
	font-size: 13px;
	line-height: 30px;
	text-align: center; 
	font-weight:bold;
	margin: -8px 0 0;
	text-decoration: none;
	color:#FFF;
	background:#33B295;
	border-radius: 6px;
	 -webkit-border-radius: 6px;
	 -moz-border-radius: 6px;
}

#wrapper #contents h1 a:hover {
	background:#CDF1E9;
    -webkit-transition: 0.4s ease-in-out;
       -moz-transition: 0.4s ease-in-out;
         -o-transition: 0.4s ease-in-out;
            transition: 0.4s ease-in-out;
}

#wrapper #contents h1 .hdl_bt {
	width: 250px;
	margin-left:12px;
	
}


/*==================================================
  responsive
==================================================*/

@media only screen and (max-width:571px) {

.pc {
	display:none;
}

.sp {
	display:inline;
}


}