@charset "utf-8";

@font-face {
    font-family: "Noto Sans Japanese";
    font-style: normal;
    font-weight: 400;
    src: url('font/NotoSansCJKjp.eot');
    src: local('Noto Sans CJK JP Light'), 
         url('font/NotoSansCJKjp.eot?#iefix') format('embedded-opentype'),
         url('font/NotoSansCJKjp.woff') format('woff'),
         url('font/NotoSansCJKjp.otf') format('opentype')
}

/* ===================================================================
Font size
 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%
=================================================================== */

/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{ margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;} body{ line-height:1;} article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{ display:block;} nav ul{ list-style:none;} blockquote, q{ quotes:none;} blockquote:before, blockquote:after,q:before, q:after{ content:''; content:none;} a{ margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}

ins{ background-color:#ff9; color:#000; text-decoration:none;}
mark{ background-color:#ff9; color:#000;  font-style:italic; font-weight:bold;}
del{ text-decoration: line-through;}
abbr[title], dfn[title]{ border-bottom:1px dotted; cursor:help;}
table{ border-collapse:collapse; border-spacing:0;}
hr{ display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
input, select{ vertical-align:middle;}



/*
YUI 3.5.1 (build 22)
Copyright 2012 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
body{	font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small}select,input,button,textarea{	font:99% arial,helvetica,clean,sans-serif}table{	font:100%;font-size:inherit;}pre,code,kbd,samp,tt{	font-family:monospace;*font-size:108%;line-height:100%}#yui3-css-stamp.cssfonts{	display:none}



/* ===================================================================
Font size
 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%
=================================================================== */


body,input,textarea,button{ font-family:  "メイリオ", Meiryo,"游ゴシック体","YuGothic","Lucida Grande","ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "Lucida Sans Unicode", Arial, Verdana, sans-serif;	-webkit-font-smoothing: antialiased;}

img{ vertical-align:bottom;}

.serif{ font-family: 'Crimson Text',"Times New Roman","游明朝体", "Yu Mincho", YuMincho,"Palatino Linotype",Palatino,"Book Antiqua","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho",  "ＭＳ Ｐゴシック",serif!important;}
.sans-serif{ font-family: "游ゴシック体","YuGothic","Lucida Grande","ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo,"Meiryo UI",  "ＭＳ Ｐゴシック",  "Lucida Sans Unicode", Arial, Verdana, sans-serif;}
.noto{	font-family:  'Noto Sans Japanese', sans-serif; font-weight:300;}
/* ===================================================================
 style info : 各種設定

fonts
 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%
=================================================================== */


html{ overflow-y: scroll;}	/* スクロールバーの有無によるズレ対策 */


/* for IE6 */
* html body{	font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;}
* html input,
* html textarea{font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;}

i{	font-style:normal;}
::-moz-selection {background:#000; color:#fff;}
::selection {background:#000; color:#fff;}
img{ vertical-align:bottom;}
iframe{	max-width:100%;}
/* ---------------------------------------------------------------- *
	link
 * ---------------------------------------------------------------- */
 
a{
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
	color: #76B547;
	text-decoration:none;
	-moz-transition-property: color,background-color,border,padding,opacity;
	-webkit-transition-property: color,background-color,border,padding,opacity;
	transition-property: color,background-color,border,padding,opacity;
	-moz-transition-duration: 0.2s;
	-webkit-transition-duration: 0.2s;
	transition-duration: 0.2s;
	-webkit-transition-timing-function: linear;
	-moz-transition-timing-function: linear;
	transition-timing-function: linear;
}
a:hover,a.hover, a:active{
	text-decoration:none;
}



/* ---------------------------------------------------------------- *
	fonts
 * ---------------------------------------------------------------- */

.xx-large{	font-size:167% !important; line-height:1.2em!important;}
.x-large{	font-size:167% !important;}
.large{		font-size:153.9% !important;}
.mid{		font-size:123.1% !important;}
.small{		font-size:108% !important;}
.x-small{	font-size:93% !important;}
.xx-small{	font-size:85% !important;}
@media screen and (max-width: 640px){
	.x-large{	font-size:161.6% !important;}
	.large{		font-size:146.5% !important;}
	.mid{		font-size:116% !important;}
	.small{		font-size:100% !important;}
	.x-small{	font-size:85% !important;}
	.xx-small{	font-size:77% !important;}
}

strong{		font-weight:bold;}
em{		font-weight:bold;	font-style:normal;}
.nowrap{ white-space:nowrap;}

.bold{		font-weight:bold !important;}
.red{		color:#FF2626 !important;}
.blue{		color:#45B29D !important;}
.blue02{		color:#4486B2 !important;}
.gray{		color:#535353 !important;}
.white{		color:#FFF !important;}
.black{		color:#333333 !important;}
.green{		color:#76B446 !important;}
.purple{		color:#32138B !important;}
.yellow{		color:#EFC94C !important;}
.orange{		color:#E27A3F !important;}

.tS01{	text-shadow:0 0 3px rgb(255,255,255);} 
/* ---------------------------------------------------------------- *
	space
 * ---------------------------------------------------------------- */

/* margin */
.ml10{	margin-left:10px !important;}
.ml15{	margin-left:15px !important;}
.ml30{	margin-left:30px !important;}
.mr0{	margin-right:0px !important;}
.mr20{	margin-right:20px !important;}
.mr30{	margin-right:30px !important;}
.mb0{	margin-bottom:0 !important;}
.mb05{	margin-bottom:5px !important;}
.mb10{	margin-bottom:10px !important;}
.mb20{	margin-bottom:20px !important;}
.mb30{	margin-bottom:30px !important;}
.mb40{	margin-bottom:40px !important;}
.mb50{	margin-bottom:50px !important;}
.mb60{	margin-bottom:60px !important;}
.mb80{	margin-bottom:80px !important;}
.mt0{	margin-top:0px !important;}
.mt05{	margin-top:5px !important;}
.mt10{	margin-top:10px !important;}
.mt20{	margin-top:20px !important;}
.mt30{	margin-top:30px !important;}
.mt40{	margin-top:40px !important;}
.mt80{	margin-top:80px !important;}
.mAuto{	margin:0 auto;}
.mA05{	margin:0 5px !important;}
.mA10{	margin:0 10px;}
@media screen and (max-width: 640px){
	.ml10{	margin-left:5px !important;}
	.ml15{	margin-left:8px !important;}
	.ml30{	margin-left:15px !important;}
	.mr20{	margin-right:10px !important;}
	.mr30{	margin-right:15px !important;}
	.mb05{	margin-bottom:5px !important;}
	.mb10{	margin-bottom:5px !important;}
	.mb20{	margin-bottom:10px !important;}
	.mb30{	margin-bottom:15px !important;}
	.mb40{	margin-bottom:20px !important;}
	.mb50{	margin-bottom:25px !important;}
	.mb60{	margin-bottom:30px !important;}
	.mb80{	margin-bottom:40px !important;}
	.mt10{	margin-top:5px !important;}
	.mt20{	margin-top:10px !important;}
	.mt30{	margin-top:15px !important;}
	.mt40{	margin-top:20px !important;}
	.mt80{	margin-top:40px !important;}

	.sp-mt0{	margin-top:0 !important;}
	.sp-mb10{	margin-bottom:10px !important;}
	.sp-mb20{	margin-bottom:20px !important;}
	.mA05{	margin:0 auto;}
	.mA10{	margin:0 auto;}
}

/* padding */

.pt05em{padding-top:.5em !important;}
.pb05em{padding-bottom:.5em !important;}
.pt1em{padding-top:1em !important;}
.pr20{padding-right:20px !important;}
.pt0{padding-top:0px !important;}
.pt30{padding-top:30px !important;}
.pl20{padding-left:20px!important;}
.pb0{padding-bottom:0px !important;}
.pb10{padding-bottom:10px !important;}
.pAll15{padding:15px!important;}
.pAll20{padding:20px!important;}
.pAll30{padding:30px!important;}
@media screen and (max-width: 640px){
	.pAll20{padding:0px!important;}
	.pAll30{padding:10px!important;}
}

/* float */

.fL{float:left !important;}
.fR{float:right !important;}
@media screen and (max-width: 640px){
	.sp-fL{float:left !important;}
}

/* text align */

.tL{text-align:left !important;}
.tR{text-align:right !important;}
.tC{text-align:center !important;	text-indent:0em !important;}

/* width */
.max100{	max-width:100%!important;}
.wFull{width:100%!important;}
.wHalf{width:50%!important;}
.wQuad{width:25%!important;}
.wThird{width:30%!important;}
.wHalf_m{width:48%!important;}
.w940{width:940px;	margin:0 auto;}
.w10{	width:10%!important;	min-width:0!important;}
.w15{	width:15%!important;	min-width:0!important;}
.w20{	width:20%!important;	min-width:0!important;}
.w25{	width:25%!important;	min-width:0!important;}
.w30{	width:30%!important;}
.w35{	width:35%!important;}
.w37{	width:37.5%!important;}
.w40{	width:40%!important;}
.w45{	width:45%!important;}
.w48{	width:48%!important;}
.w49{	width:49%!important;}
.w50{	width:50%!important;}
.w55{	width:55%!important;}
.w60{	width:60%!important;}
.w65{	width:65%!important;}
.w68{	width:68%!important;}
.w70{	width:70%!important;}
.w80{	width:80%!important;}
.w90{	width:90%!important;}
.w100{	width:100%!important;}
@media screen and (max-width: 640px){
	.sp-max100{	max-width:100%!important;}
	.sp-w100{	width:100%!important;}
	.sp-w80{width:80%!important;}
	.sp-w50{width:50%!important;}
	.sp-w25{width:25%!important;}
	.sp-w20{	width:20%!important;}
	.sp-w40{	width:40%!important;}
	.sp-w60{	width:60%!important;}
}

/* border */

.b01{	border:solid 1px #F0F0ED;	padding:10px 10px 0;}
.b02{	border:solid 5px #0072AC;}
@media screen and (max-width: 470px){
	.b02{	border:solid 2px #0072AC;}
}



/* ---------------------------------------------------------------- *
	hover
 * ---------------------------------------------------------------- */

a .op,button .op,a.op,input[type="submit"].op{ -moz-transition:opacity 0.2s linear; -webkit-transition:opacity 0.2s linear; transition:opacity 0.2s linear;}
a:hover .op ,input[type="submit"].op:hover,button .op:hover,
a.op:hover{
	opacity:0.6; -moz-opacity:0.6;
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
	-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=60)';
}

/* ---------------------------------------------------------------- *
	form
 * ---------------------------------------------------------------- */

button,input[type="button"],input[type="submit"],input[type="reset"]{	-webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);}
label{	display:inline-block;	/display:inline;}
button,input[type="button"],input[type="submit"],input[type="reset"]{	display:inline-block;	-webkit-appearance: none;}
button,input[type="button"]:focus,input[type="submit"]:focus,input[type="reset"]:focus{	outline:none;}

/* ---------------------------------------------------------------- *
	clear
 * ---------------------------------------------------------------- */

.clear{ clear:both; display:block;}

/* micro Clearfix */
.cf:before,
.cf:after{ content:""; display:table;}
.cf:after{ clear:both;}
.cf{ zoom:1;}

/* Legacy Clearfix */
.cfL:after{	content: ".";	display: block;	height: 0;	clear: both;	visibility: hidden;}
.cfL{display:inline-block;}
* html .cfL{height: 1%;}
.cfL{display: block;}