@charset "utf-8";
:root {
    --baseColor: #19306E;
    /*--baseAlpha: rgba(25,48,110,0.8);*/
    --baseAlpha: rgba(50,96,220,0.3);
    --blue: #007bff;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --primary: #007bff;
    --secondary: #6c757d;
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}

/*
■■■■■■■■■■■■■■■■■■■■
    Delighters.js 関連
■■■■■■■■■■■■■■■■■■■■
*/
.delighter{
    transition: all .7s ease-out;
    transform: translateY(36px);
    opacity: 0;
}
.started{
    opacity: 1;
    transform: translateY(0px);
}
.ended{
}
/*---------------------------------------------------------------------------*/




html{
    /* フォントサイズの正確に */
    -webkit-text-size-adjust: 100%;
    /* 文字をシャープに */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* カーニングとリガチャ（合字）を調整 */
    text-rendering: optimizeLegibility;
    font-smoothing: antialiased;
}

/*
■■■■■■■■■■■■■■■■■■■■
    前提
■■■■■■■■■■■■■■■■■■■■
*/

body{
    font-size: 16px;
    background: #fff;
    color: #111;
    font-family: 'メイリオ','YuGothic','Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', 'Meiryo','ＭＳ ゴシック',sans-serif;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    line-height: 1.7;
}

body{
    margin: 0;
    padding: 0;
    opacity: 0;
    transition-duration: 0.5s;
}
body.appear{
    opacity: 1;
}

*{
    box-sizing: border-box;
    behavior: smooth;
    block: 'start';
    image-rendering: pixelated;
    image-rendering: crips-edged;
    image-rendering: auto;
}

/*
■■■■■■■■■■■■■■■■■■■■
    フォント
■■■■■■■■■■■■■■■■■■■■
*/
.mincho{
    font-family: 'cursive','ＭＳ 明朝', 'ＭＳ 明朝', 'ヒラギノ明朝', 'HG明朝E',  serif, 'Noto Serif JP';
}
.gothic{
    font-family: 'メイリオ','YuGothic','Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', 'Meiryo','ＭＳ ゴシック',sans-serif;
}

.fuchidoriB {
  text-shadow:
    1px 1px 4px #000,
    -1px 1px 4px #000,
    -1px -1px 4px #000,
    1px -1px 4px #000;
}
.fuchidoriW {
  text-shadow:
    1px 1px 4px #fff,
    -1px 1px 4px #fff,
    -1px -1px 4px #fff,
    1px -1px 4px #fff;
}

/*
■■■■■■■■■■■■■■■■■■■■
    基本セレクタ
■■■■■■■■■■■■■■■■■■■■
*/
div,section,header,footer,article{
    box-sizing: border-box;
    border-collapse: collapse;
}
p{
    margin: 0;
    padding: 0;
}
a{
    color: inherit;
    text-decoration: none;
}
ul{
    padding: 0;
    margin: 0;
}
li{
    list-style: none;
}

h1,h2,h3,h4,h5,h6{
    font-weight: normal;
    font-size: 1rem;
    margin: 0;
    padding: 0;
}

img {
    vertical-align: middle;
    border-style: none;
}

/*
■■■■■■■■■■■■■■■■■■■■
    ブロックスタイル
■■■■■■■■■■■■■■■■■■■■
*/
.sep8{
    height: 8px;
}
.sep16{
    height: 16px;
}
.sep32{
    height: 32px;
}
.sep64{
    height: 64px;
}
.sep50{
    height: 50px;
}
.table{
    display: table;
}
.tr{
    display: table-row;
}
.td,
.td1,
.td2,
.td3,
.td4,
.td5,
.td6,
.td7,
.td8,
.td9,
.td10,
.td11,
.td12,
.td13,
.td14,
.td15,
.td16{
    display: table-cell;
}
.th,
.th1,
.th2,
.th3,
.th4,
.th5,
.th6,
.th7,
.th8,
.th9,
.th10,
.th11,
.th12,
.th13,
.th14,
.th15,
.th16{
    display: table-cell;
}

.areaSubject{
    width: 300px;
    margin: 0 auto;
    margin-bottom: 96px;
}
.areaSubject > img{
    width: 100%;
    height: auto;
}

/*
■■■■■■■■■■■■■■■■■■■■
    フォームパーツ
■■■■■■■■■■■■■■■■■■■■
*/
input,select,textarea{
    padding: 4px;
    width: 100%;
}

textarea{
    height: 100px;
}

.btnSubmit{
    border-style: none;
    border: #869791 1px solid;
    background-color: #D6D6D6;
    padding: 8px;
    width: 100%;
}

.blockLabel{
    display: block;
}

.linkLabel{
    margin-top: -100px;
    padding-top: 100px;
}

/*
■■■■■■■■■■■■■■■■■■■■
    全ページパーツ
■■■■■■■■■■■■■■■■■■■■
*/
.toRemoteSupportIcon{
    position: fixed;
    top: 108px;
    left: 16px;
    width: 200px;
    z-index: 998;
}
.toRemoteSupportIcon > img{
    width: 100%;
    height: auto;
}
.toRemoteSupportIcon:hover{
    opacity: 0.7;
}


/*
■■■■■■■■■■■■■■■■■■■■
    最終適用
■■■■■■■■■■■■■■■■■■■■
*/
.invisible{
    display: none;
}
.pcno{
    display: none;
}
