@charset "utf-8";

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

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

body {
	width:100%;
	font-size: 100%;
    font-family: "Helvetica Neue",Arial,
    "Hiragino Kaku Gothic ProN","Hiragino Sans",
    Meiryo,sans-serif;
	font-family: MFW-ShueiGoGinStd-L;
	color: #000;
	background:#FFF;
	text-align: center;
}

h1, h2, h3, h4, h5, h6{
    font-feature-settings: "palt" 1;
	font-family: MFW-ShueiGoGinStd-B;
    font-weight:bold;
}

p{
    text-align: justify;
    font-feature-settings: "palt" 1;
    word-break: keep-all;
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-line-break: strict;
    line-break: strict;
    transition:0.2s;
}

a{ 
    font-feature-settings: "palt" 1;
    word-break: keep-all;
}

hr{
    height: 0;
	margin: 0;
	padding:0;
	border: 0
}

span.dir{
    -webkit-text-combine: horizontal;
    -ms-text-combine-horizontal: all;
    text-combine-upright:all;
}

span.dir_s{
    letter-spacing: -0.1em;
}

p span.nfont{
    font-family: "Hiragino Kaku Gothic ProN",Meiryo;
}

p span.indent{
    text-indent:-0.5em;
}

[data-ruby] {
    position: relative;
}
[data-ruby]::before {
    content: attr(data-ruby);
    position: absolute;
    top: -1.5em;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 0.5em;
}

.w300 {
    font-weight: 300;
}
.w600 {
    font-weight: 600;
}
.w900 {
    font-weight: 900;
}

.txt-l {
    font-size:120%;
}
.txt-s {
    font-size:80%;
}

.t-c{
    text-align: center;
}
.t-l{
    text-align: left;
}
.t-r{
    text-align: right;
}

.box{
    margin:0 auto 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%); 
    transform: translateY(-50%) translateX(-50%);
}

.flexbox{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
    -ms-flex-wrap: wrap;
  	flex-wrap: wrap;
    -webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

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

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

/*img.rd {
		image-rendering: -webkit-optimize-contrast;
	}*/

h1>img,h2>img,h3>img,h4>img,h5>img,h6>img{
    width:100%;
}

h1>picture img,h2>picture img,h3>picture img,h4>picture img,h5>picture img,h6>picture img{
    width:100%;
}

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

ul li{
	list-style-type: none;
	margin:0;
	padding:0;
}
/*---button---*/
button {
  padding: 0;
  border: none;
  background: transparent;
}

button img {
  display: block;
}

/*---video---*/
div.videoArea{
    margin:1em auto 3em;
    position:relative;
    animation-duration: 2.5s;
}

.iframe-wrapper {
	position: relative;
      width: 100%;
	margin:0px auto;
    background: rgba(255,255,255,0.8);
    padding: calc(352 / 640 * 100%) 0 0;
}

.iframe-wrapper iframe{
	position: absolute;
    top: 0;
    left: 0;
	width: 100%;
  	height: 100%;
}
div.yt{
    margin:0 auto 1em;
}

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

.dn{
	display: none;
}

.pcdn{
    display:none;
}

.spdn{
    display:block;
}

div[data-dev='PC'] {
  display:block;
}
div[data-dev='SP'] {
  display:none;
}

/* =======================================
	SMPH
======================================= */

@media screen and (max-width: 640px) {
    .pcdn{display:block;}
    .spdn{display:none;}
    br.pcdn{display:inline;}
	
	div[data-dev='PC'] {
		  display:none;
		}
	
	div[data-dev='SP'] {
		  display:block;
		}
    .flexbox{
	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
    -ms-flex-wrap: wrap;
  	flex-wrap: wrap;
    -webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
    flex-flow: column;
}
    
}

/* =======================================
	HACK
======================================= */

/*for Firefox*/
@-moz-document url-prefix() {
      /*for smph;*/
      @media screen and (max-width: 640px) {
      }
}

/*for Chrome*/
@media screen and (-webkit-min-device-pixel-ratio: 0)
    and (min-resolution: .001dpcm) {
	
}

/*for Safari*/
@media screen and (-webkit-min-device-pixel-ratio:0)
  and (min-color-index:0) {
      p{word-break: normal !important;word-wrap: break-word;}
      span.dir_s{-webkit-text-orientation:mixed;}
}
_::-webkit-full-page-media, _:future, :root p{
    word-break: normal !important;word-wrap: break-word;
}
_::-webkit-full-page-media, _:future, :root span.dir_s{
    -webkit-text-orientation:mixed;
}