/*========================================

　●　各要素の初期設定
　●　簡易定義

========================================*/


/*========================================
　●　各要素の初期設定
========================================*/
*{
 margin: 0; padding: 0;
 box-sizing: border-box;
}

/*------------------------------ 文字サイズの定義・基本文字色等 */
html,body{ width: 100%;}

html{
 overflow-y:scroll;
 overflow-x: hidden;
 line-height: 1;
}

body{
 line-height: 1;
 font-family: 'Noto Sans JP',-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}

h1,h2,h3,h4{ font-weight: normal;}

img{ vertical-align: top;}

/*========================================
　●　簡易定義
========================================*/
/*------------------------------ 文字色 */
.c-green  { color: var(--main-green);}
.c-pink   { color: var(--main-pink);}
.c-orange { color: var(--main-orange);}
.c-blue   { color: var(--main-blue);}
.c-skyblue{ color: var(--main-skyblue);}
.c-purple { color: #c63ea6;}

.c-bold{font-weight: bold;}

/*------------------------------ 文字サイズ */
.c-f28{font-size: 28px;}
.c-f36{font-size: 36px;}

/*------------------------------ 字下げ */
.c-indent{
 padding-left: 1em;
 text-indent: -1em;
}

/*------------------------------ position */
.c-relative{position: relative;}
.c-absolute{position: absolute;}
.c-fixed{position: fixed;}

/*------------------------------ inline-block */
.c-inlineB{ display: inline-block;}

/*------------------------------ overflow */
.c-hidden{ overflow: hidden;}
.c-hiddenX{ overflow-x: hidden;}

/*------------------------------ シンプルフェード */
/* animation: ani_fade 2.0s ease-out forwards; */
@keyframes ani_fade{
  0% {opacity: 0;}
100% {opacity: 1;}
}