@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,500,700,900&display=swap&subset=japanese');

/* ----------------------------------
  PC　SP view divergence - utility
---------------------------------- */
.u-media-pc {
  display: block;
}
.u-media-sp {
  display: none;
}

br.u-media-pc,
br.u-media-sp {
	font-size: 0;
}

/*--------------------------------------------------------

	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 */

/*--------------------------------------------------------

	common

--------------------------------------------------------*/
.clear {
	clear:both;
}

#container .btn, #container a {
	font-weight: bold;
}
#container .btn, #container a:hover {
	text-decoration: underline;
}

/*--------------------------------------------------------

	font

--------------------------------------------------------*/

.font-serif {
	font-family: georgia,'times new roman',serif;
}

.font-large {
	font-size: 1.4em !important;
}
.font-semi-large {
	font-size: 1.2em !important;
}
.font-ex-middle {
	font-size: .9em !important;
}
.font-middle {
	font-size: .8em !important;
}
.font-semi-middle {
	font-size: .7em !important;
}
.font-small {
	font-size: .6em !important;
}
.font-normal {
	font-weight: normal;
}
.font-bold {
	font-weight:bold;
}
.font-br {
    display: block;
}
.font-center {
	text-align:center;
}
.font-right {
	text-align:right;
}

.font-black {
	color: #000;
}
.font-red {
	color: #ff0000;
}
.font-green {
	color: #00b050;
}

.text-ind-m10 {
	margin: 0 0 0 1em;
	text-indent: -1em;
}

.text-underline {
	border-bottom: solid 1px #333; 
}

/**/
.m-b0 {
	margin-bottom: 0px !important;
}
.m-b9 {
	margin-bottom: 9px !important;
}
.m-b10 {
	margin-bottom: 10px !important;
}
.m-b20 {
	margin-bottom: 20px !important;
}
.m-b30 {
	margin-bottom: 30px !important;
}
.m-b40 {
	margin-bottom: 40px !important;
}
.m-b50 {
	margin-bottom: 50px !important;
}
.m-b60 {
	margin-bottom: 60px !important;
}
.m-b70 {
	margin-bottom: 70px !important;
}
.m-b80 {
	margin-bottom: 80px !important;
}
.m-t-10 {
	margin-top: -10px !important;
}
.m-t-20 {
	margin-top: -20px !important;
}
.m-t0 {
	margin-top: 0px !important;
}
.m-t10 {
	margin-top: 10px !important;
}
.m-t20 {
	margin-top: 20px !important;
}
.m-t30 {
	margin-top: 30px !important;
}
.m-t35 {
	margin-top: 35px !important;
}

.p-b0 {
	padding-bottom: 0px !important;
}
.p-b5 {
	padding-bottom: 5px !important;
}
.p-b10 {
	padding-bottom: 10px !important;
}
.p-b20 {
	padding-bottom: 20px !important;
}
.p-t0 {
	padding-top: 0px !important;
}
.p-t10 {
	padding-top: 10px !important;
}
.p-t20 {
	padding-top: 20px !important;
}
.p-l0 {
	padding-left: 0 !important;
}
.p-l8 {
	padding-left: 8px !important;
}
.p-l10 {
	padding-left: 10px !important;
}
.p-l15 {
	padding-left: 15px !important;
}
.p-l20 {
	padding-left: 20px !important;
}
.p-r10 {
	padding-right: 10px !important;
}
.p-r15 {
	padding-right: 15px !important;
}
.p-r30 {
	padding-right: 30px !important;
}

.ls-m003 {
	letter-spacing: -0.03em;
}
.ls-m005 {
	letter-spacing: -0.05em;
}
.ls-m030 {
	letter-spacing: -0.3em;
}
.ls-m050 {
	letter-spacing: -0.5em;
}

.ls-m100 {
	letter-spacing: -1em;
}

.lh-12 {
	line-height: 1.2;
}

/*--------------------------------------------------------

	layout

--------------------------------------------------------*/
div#container {
	margin:0 auto;
	padding:0;
	width: 100%;

}

.w-180 {
	width: 180px;
}
.w-200 {
	width: 200px;
}
.w-202 {
	width: 202px;
}
.w-250 {
	width: 250px;
}
.w-560 {
	width: 560px;
}
.w-640 {
	width: 640px;
}

.freeArea {
	margin-top: 0px;
}

.v-align-m{
	vertical-align: middle !important;
}

/*--------------------------------------------------------

	lower

--------------------------------------------------------*/
div#lower a {
	color:#000;
}
div#lower h2 {
	margin: 0 0 30px 0;
}
div#lower h3 {
	margin:30px 0 15px 0;
	color:#D7000F;
}
div#lower h4 {
	margin:15px 0 5px 0;
	font-size:80%;
}
div#lower p {
	font-size:12px;
	line-height:1.8;
}
div#lower ul.style01 {
	margin:20px 0;
	line-height:200%;
}
div#lower ul.style01 li a {
	background: url("../images/common/i_arw.jpg") no-repeat left center;
	padding: 0 0 0 20px;
}
div#lower{
	width:920px;
	margin:0 auto;
}

/* -----------
　フェードイン
----------- */
body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}




/********************************************************************************

  02. forSP Layout
  *横幅が667px以下の場合
  

********************************************************************************/

@media screen and (min-width: 0px) and (max-width: 668px) {



/* ----------------------------------
  PC　SP view divergence - utility
---------------------------------- */
.u-media-pc {
  display: none;
}
.u-media-sp {
  display: block;
}

.font-semi-large {
	font-size: 1.1em !important;
}

.font-br {
    display: inline;
}


/**/
.m-b0-sp {
	margin-bottom: 0px !important;
}
.m-b10-sp {
	margin-bottom: 10px !important;
}
.m-b20-sp {
	margin-bottom: 20px !important;
}
.m-b30-sp {
	margin-bottom: 30px !important;
}
.m-b40-sp {
	margin-bottom: 40px !important;
}
.m-b50-sp {
	margin-bottom: 50px !important;
}
.m-b60-sp {
	margin-bottom: 60px !important;
}
.m-b70-sp {
	margin-bottom: 70px !important;
}
.m-b80-sp {
	margin-bottom: 80px !important;
}

.p-t10-sp {
	padding-top: 10px !important;
}
.p-l0-sp {
	padding-left: 0 !important;
}
.p-l2-sp {
	padding-left: 2px !important;
}
.p-l12-sp {
	padding-left: 12px !important;
}
.p-l15-sp {
	padding-left: 15px !important;
}
.p-r0-sp {
	padding-right: 0 !important;
}

.ls-m015-sp {
	letter-spacing: -.15em;
}

.w-30per-sp {
	width: 30%;
}


}