﻿@charset "utf-8";

/* =======================================
	CommonElements
======================================= */


/*ローディング画面の設定*/
#loading {
	width:100%;
	height:100%;
	position:fixed;
	top: 0;
	left: 0;
	margin: auto;
	background:#FFFFFF;
	zoom: 1;
	display: none;
	z-index:9999;
}

#loading div#loadArea{
    width:100%;
    position:absolute;
    left:0;
    top:45vh;
}

/* ラインの最初の色のスタイル */
#line {
    width:100%; /* 横幅100% */
    height:2px;
    margin:0 auto;
    position:relative;
}
 
/* ラインのアニメーション時の色と動き */
.expand{
    width:100%;
    height:2px;
    margin:0;
    background:#EF0072;
    box-shadow: 0 1px 15px 0 rgba(239,0,114,0.7);
    position:absolute;
    left:0;
    top:0;
    -moz-animation:fullexpand 3.2s ease-out;
    -webkit-animation:fullexpand 3.2s ease-out;
}
 
 /* キーフレームを使った横幅100%のローディングの始まりと終わりの変化 */
@-moz-keyframes fullexpand {
    0%  { width:0px;}
    100%{ width:100%;} 
}
@-webkit-keyframes fullexpand {
    0%  { width:0px;}
    100%{ width:100%;} 
}



/**/
body,header,footer,section,ul{
    margin:0;
    padding:0;
}

body {
	width:100%;
	font-size: 100%;
	font-family:"Noto Sans JP","Helvetica",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans", "Yu Gothic",sans-serif;
	color: #000;
	background:#FFF;
	text-align: center;
	font-size:1em;
    font-weight:500;
	/*font-size:1.2vw;*/
	scroll-behavior: smooth;
}

@media screen and (min-width: 1200px) {
    body{
     font-size:1.1em;   
    }
}

img {
    image-rendering: -webkit-optimize-contrast;
}

::-webkit-full-page-media, :future, :root
 img {
    image-rendering: auto;
}

/*---link---*/

a:link { text-decoration:underline; color: #375270;}
a:visited { text-decoration:underline; color: #375270;}
a:active { text-decoration:underline; color: #375270;}
a:hover { text-decoration:none; color: #EF0072;}

/*---list---*/
ul{
	margin:0;
	padding:0;
}

ul li{
	list-style-type: none;
	margin:0;
	padding:0;
}

/*---fontSize---*/

p{line-height:1.2em;}

.txt-xxl{font-size:1.5em}
.txt-xl{font-size:1.3em}
.txt-l{font-size:1.2em}
.txt{font-size:1.0em}
.txt-m{font-size:0.9em}
.txt-mm{font-size:0.8em}
.txt-s{font-size:0.7em}
.txt-ss{font-size:0.6em}

.txt-xxl_b{font-size:1.5em;font-weight:bold}
.txt-xl_b{font-size:1.3em;font-weight:bold}
.txt-l_b{font-size:1.2em;font-weight:bold}
.txt_b{font-size:1.0em;font-weight:bold}
.txt-m_b{font-size:0.9em;font-weight:bold}
.txt-mm_b{font-size:0.8em;font-weight:bold}
.txt-s_b{font-size:0.7em;font-weight:bold}
.txt-ss_b{font-size:0.6em;font-weight:bold}

.space-nar{letter-spacing:-0.1em}
.space-wide{letter-spacing:0.5em}

.pin{
    color:#EF0072;
}
.p_pin{
    color:#FFD7E6;
}
.yel{
    color:#FFF1A7;
}
.pur{
    color:#9C9AE1;
}
.grn{
    color:#67C7CB;
}
.blu{
    color:#93DAF7;
}
.gra{
    color:#97B0C1;
}

/**/
.pinBg{
    background:#FEC3D3
}
.p-pinBg{
    background:#F4D1CD
}
.purBg{
    background:#E1B9E1
}
.p-purBg{
    background:#D4CEE8
}
.oraBg{
    background:#EBC384
}
.p-oraBg{
    background:#F8E0AD
}
.bluBg{
    background:#93C9E5
}
.p-bluBg{
    background:#DEEFF4
}
.p-grnBg{
    background:#E1EEB8
}
.bgeBg{
    background:#FDEDD4
}

/*---fontSize end---*/

button {
  padding: 0;
  border: none;
  background: transparent;
}

button img {
  display: block;
}


/*表示*/
.cb{
	clear:both;
}

.dn{
	display: none;
}
