@charset "utf-8";

/*
エディタ＆表示側　両方から参照するCSS
*/

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
フォント
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* アンドロイド用の明朝フォント */
/*@import url("https://fonts.googleapis.com/css?family=Noto+Serif+JP:400,700&display=swap&subset=japanese");*/

@import url("../../../cyber-ec-child/font/icomoon/style.css");/* ソーシャルボタン */

/* @import url(https://fonts.googleapis.com/css?family=Montserrat:300,400,500,700); */

/* @import url('https://fonts.googleapis.com/css?family=Dosis|Roboto+Condensed|Ropa+Sans|Teko'); */
/* @import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:500,900');*/

/* ▼notosansの直リンクでの使用を廃止2018-04-30（読み込み時間に相当な負荷を与えていることが判明したため）*/
/* @import url('https://fonts.googleapis.com/earlyaccess/notosansjapanese.css'); */

/* ▼notosansの利用を廃止2018-11-11（太字や数字のデザインが微妙なため）*/
/*
@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 400;
   src: url(font/notosansjapanese/subset/fonts/NotoSans_Regular.woff2) format('woff2'),
        url(font/notosansjapanese/subset/fonts/NotoSans_regular.woff) format('woff'),
        url(font/notosansjapanese/subset/fonts/NotoSans_regular.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 700;
   src: url(font/notosansjapanese/subset/fonts/NotoSans_Bold.woff2) format('woff2'),
        url(font/notosansjapanese/subset/fonts/NotoSans_bold.woff) format('woff'),
        url(font/notosansjapanese/subset/fonts/NotoSans_bold.otf) format('opentype');
 }
*/

/* ▼各種フォントの読み込み（@font-faceで定義した時点では読み込みは行われない｡font-familyプロパティで先頭からフォントを探して見つかった時点で読み込みが実行される[検証：Chrome]） */

/* ▼NOTOフォント */
@font-face {
    font-family: "noto_sans_r";
    src:url('font/noto/noto_sans_cjk_r.woff') format('woff');
}
@font-face {
    font-family: "noto_sans_m";
    src:url('font/noto/noto_sans_cjk_m.woff') format('woff');
}
@font-face {
    font-family: "noto_sans_b";
    src:url('font/noto/noto_sans_cjk_b.woff') format('woff');
}
.noto_sans_r {
    font-family: "noto_sans_r";
}
.noto_sans_m {
    font-family: "noto_sans_m";
}
.noto_sans_b {
    font-family: "noto_sans_b";
}

/* ▼游ゴシック／游明朝 */
@font-face {
    font-family: "yu_goth_l";
    src:url('font/yu/yu_goth_l.woff') format('woff');
}
@font-face {
    font-family: "yu_goth_r";
    src:url('font/yu/yu_goth_r.woff') format('woff');
}
@font-face {
    font-family: "yu_goth_m";
    src:url('font/yu/yu_goth_m.woff') format('woff');
}
@font-face {
    font-family: "yu_goth_b";
    src:url('font/yu/yu_goth_b.woff') format('woff');
}
@font-face {
    font-family: "yu_min_l";
    src:url('font/yu/yu_min_l.woff') format('woff');
}
@font-face {
    font-family: "yu_min_r";
    src:url('font/yu/yu_min_r.woff') format('woff');
}
@font-face {
    font-family: "yu_min_db";
    src:url('font/yu/yu_min_db.woff') format('woff');
}
.yu_goth_l {
    font-family: "yu_goth_l";
}
.yu_goth_r {
    font-family: "yu_goth_r";
}
.yu_goth_m {
    font-family: "yu_goth_m";
}
.yu_goth_b {
    font-family: "yu_goth_b";
}
.yu_min_l {
    font-family: "yu_min_l";
}
.yu_min_r {
    font-family: "yu_min_r";
}
.yu_min_db {
    font-family: "yu_min_db";
}

/* ▼ヒラギノ角ゴ／明朝 */
@font-face {
    font-family: "hira_kakugo_w3";
    src:url('font/hiragino/hira_kakugo_std_w3.woff') format('woff');
}
@font-face {
    font-family: "hira_kakugo_w4";
    src:url('font/hiragino/hira_kakugo_std_w4.woff') format('woff');
}
@font-face {
    font-family: "hira_kakugo_w5";
    src:url('font/hiragino/hira_kakugo_std_w5.woff') format('woff');
}
@font-face {
    font-family: "hira_kakugo_w6";
    src:url('font/hiragino/hira_kakugo_std_w6.woff') format('woff');
}
@font-face {
    font-family: "hira_kakugo_w7";
    src:url('font/hiragino/hira_kakugo_std_w7.woff') format('woff');
}
@font-face {
    font-family: "hira_min_w4";
    src:url('font/hiragino/hira_min_std_w4.woff') format('woff');
}
@font-face {
    font-family: "hira_min_w5";
    src:url('font/hiragino/hira_min_std_w5.woff') format('woff');
}
.hira_kakugo_w3 {
    font-family: "hira_kakugo_w3";
}
.hira_kakugo_w4 {
    font-family: "hira_kakugo_w4";
}
.hira_kakugo_w5 {
    font-family: "hira_kakugo_w5";
}
.hira_kakugo_w6 {
    font-family: "hira_kakugo_w6";
}
.hira_kakugo_w7 {
    font-family: "hira_kakugo_w7";
}
.hira_min_w4 {
    font-family: "hira_min_w4";
}
.hira_min_w5 {
    font-family: "hira_min_w5";
}

body,input, textarea, keygen, select, button, .gothic{
	/* IE11では游系、ヒラギノ系フォントが上に数px吊り上がるバグがある（2018-05-20時点） */

	/* PCはサブセットの使用を止め、OSに搭載された游ゴシックを優先的に使用する(2020-01-17)mk */
    font-family: 游ゴシック, "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", "メイリオ", Meiryo, "Osaka", "MS Pゴシック", "MSゴシック", Helvetica, verdana, arial;
    /* font-family: "my_gothic", "メイリオ", Meiryo, "Osaka", "MS Pゴシック", "MSゴシック", Helvetica, verdana, arial; */
	
    /* font-family: "Roboto","Noto Sans Japanese","メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", "Osaka", "MS Pゴシック", "MSゴシック", Helvetica, verdana, arial; */
	/* 機種依存の游ゴシックを使う場合、下記の記述が必要 */
	font-weight:500;
}
.mincho {
	/* 明朝フォントもデバイス依存でやってみる(2020-05-03)mk※但し、アンドロイドは明朝無いのでnoto-serifを使う */
	/*font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN",'Noto Serif JP', serif;*/
	/* JSによる後読みを採用しつつも、後読みが完了するまでは、デバイスフォントで補う(2020-07-12)mk */
    /*font-family: "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "my_mincho", serif;*/
	
	/* iPhone用にデバイスフォントのヒラギノを先に読ませていたが、デバイスフォントはW3しかなく、W4を当てるためにデバイスフォントの指定を停止(2020-09-07mk) */
    font-family: "my_mincho", serif;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
リセットCSS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media screen and (max-width: 1300px) {
body{
    text-size-adjust: 100%;/* ios系端末のフォントサイズ自動調節機能を回避 */
    -webkit-text-size-adjust: 100%;/* ios系端末のフォントサイズ自動調節機能を回避 */
    word-wrap: break-word
}
}/* end media query */
* {
    box-sizing: border-box;
}
html,
body{
    font-size: 62.5%;/* ベースの初期化→必須 */
	/* height:100%; */ /* 子要素でheight:100%;を利用できるようにする */
}
body{
    margin:0;
    word-break: break-all;/* 長いURLなど、文節を含まない英数文字でも適切に改行を行なうための指定(2016-11-09) */
}
h1,h2,h3,h4,h5,h6{
    font-size: 100%;/* ベースの初期化→必須 */
    font-weight: bold;
    margin:0;
}
em{
    font-style:normal;
}
th{
    /*font-weight:normal;*/
    font-weight: 500;
    white-space: nowrap;/* TH列に一々幅指定をしなくても良い様にするための指定(2016-11-08) */
}
@media screen and (max-width: 640px) {
	th{
		white-space: normal;/* スマホの場合は突っ張ると困るので改行を許可(2017-10-26) */
		min-width: 90px;/* すぐに改行されると困るので、最低幅を設定(2017-11-17) */
	}
}/* end media query */

td{
	word-break: break-all;/* 英単語が途中で改行されないことにより、スマホで横スクロールが出てしまわない様に指定(2017-08-28) */
}

ul,ol {
    list-style-type: none;
    padding-left: 0;
    margin: 0;
}
ol li:before{
    font-family: "Roboto",sans-serif;
}
dl,
dd {
    margin: 0;
}
p,
blockquote {margin: 0;}
table {
    border-collapse: collapse;
}
img{
    max-width:100%;
    vertical-align: bottom;
    height:auto;
}
.pixelated {
    /* 画像がボヤける現象を回避する */
    -ms-interpolation-mode: nearest-neighbor;   /* IE8+ */
    image-rendering: -webkit-optimize-contrast; /* Safari (WebKit) */
    image-rendering: -moz-crisp-edges;          /* Firefox (Gecko) */
    image-rendering: -o-crisp-edges;            /* Opera 12.x */
    image-rendering: pixelated;                 /* Chrome 41+, Opera 29+ (CSS4) */
}
a img{border:none;}/* forIE */
label{
	cursor: pointer;
    display: inline-block;
}
textarea, input, select,button {
    max-width: 100%;
}
select {
    margin: 2px;
    cursor: pointer;
}
input[type="submit"],
input[type="button"],
button {
    cursor: pointer;
    border: none;
    display:inline-block;
}
input[type="submit"],
input[type="button"] {
    -webkit-appearance: none;
}
sup {
    font-size: .5em;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
デフォルトCSS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
body,input, textarea, keygen, select, button{
    font-size:13px;
    line-height:1.4;
    /* color:#333; */
    color:#151515;
}
@media screen and (max-width: 640px) {
	input, textarea, keygen, select, button{
		/* iOSの「16px以下のフィールドを拡大表示する」仕様を回避するための指定 */
	    font-size:16px;
	}
}/* end media query */

h1,h2,h3,h4,h5,h6{
    line-height:1.4;
}

a {
    color: #09f;
    text-decoration: underline;
}

a:hover {
    text-decoration: none;
}

table {
    width: 100%;
    /*background-color:#fff;*/
}
th {
    text-align: left;
}
/* OLのカウンター */
ol{
  counter-reset: ol_cnt;
}
ol ol{
  counter-reset: ol_cnt2;
}
ol ol ol{
  counter-reset: ol_cnt3;
}
ol > li{
  counter-increment: ol_cnt;
}
ol ol > li{
  counter-increment: ol_cnt2;
}
ol ol ol > li{
  counter-increment: ol_cnt3;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
スタイル変化時のアニメーション
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* アスタリスクセレクタで一括指定していたが、IEのセレクトボックスの動作が不自然になるバグがあり、変更(2017-01-20) */
a,
li{
-webkit-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
transition: all 0.2s linear;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
テキスト選択時のスタイル変更
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
::selection {
    background: rgba(30, 140, 190, 0.5);
    color: #FFF;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Clear Fix
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cf:before,
.cf:after {
    content:"";
    /*display:table;*/
    display:block;
}
.cf:after {clear:both;}
.cf {zoom:1;}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
placeholder属性のテキストカラーを変更（※IEのプレースホルダの文字色はかなり濃いので､変更は必須｡また､何故かカンマセレクタで一括指定が出来なかった）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 各ベンダープレフィックスが取れた標準版 */
:placeholder-shown {
    color: #888;
}

/* Google Chrome, Safari, Opera 15+, Android, iOS */
::-webkit-input-placeholder {
    color: #888;
}

/* Firefox 18- */
:-moz-placeholder {
    color: #888;
    opacity: 1;
}

/* Firefox 19+ */
::-moz-placeholder {
    color: #888;
    opacity: 1;
}

/* IE 10+ */
:-ms-input-placeholder {
    color: #888;
}