@charset "utf-8";
/* ==============================================================
ファイル名 : common.css
============================================================== */
@import url("reset.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');

body, div, span, dl, dt, dd, pre, p, ul, ol, li, form, fieldset, input,
textcontents, blockquote, table, caption, th, td {
	font-family: "Noto Sans JP", sans-serif;
}

/* ==============================================================
共通項目指定
============================================================== */

html,body{
	height: 100%;
	margin: 0;
	padding: 0;
}
html {
	font: 200 62.5% "Noto Sans JP", sans-serif;	/*	62.5% = 10px	*/
}

body {
	background-color: white;
	color: black;
    font-size: 1.5em;
}

.sans-serif { font-family: "Noto Sans JP", sans-serif; }
.serif { font-family: "Noto Serif JP", serif; }

a, a:link, a:active, a:visited { color: #dc7308; text-decoration: none; }
a:hover { color: gray; }

small { font-size: .8em; }
/* ==============================================================
エリア指定
============================================================== */
header, .content, footer {
    text-align: center;
}

header {
    padding: 80px 0;
    background: #c9c9c9;
}
header h1 {
    font: 300 3.2em/1.2em "Noto Serif JP", serif;
    text-align: center;
}
header h1 small {
    font-size: .6em;
    margin-left: 1em;
}
header h1 span {
    padding: .25em 2em .33em;
    font: 200 .5em "Noto Serif JP", serif;
    background: white;
    border: 1px solid black;
    border-radius: 2em;
}
.content {
    margin: auto;
    padding: 80px 0;
    width: 96%;
    max-width: 1100px;
}
#main { width: 67%; }
#side { width: 26%; }

footer {
	z-index: 20;
	bottom: 0;
	margin: auto;
	padding: 0 auto;
    width: 100%;
    background: #eee;
}
.footerInner {
    margin: auto;
    padding: 80px 0;
    width: 96%;
    max-width: 1100px;
    text-align: left;
}
.footerInner img { margin-bottom: 1em; width: 14em; }

/* 装飾
---------------------------------------------------------------------------------- */
ol { font-size: .9em; }
ul { font-size: 1em; line-height: 1.8em; }
.fxContainer { display: flex; flex-wrap: wrap; }
.spBetween { justify-content: space-between; }

.w100, .w90, .w80, .w70, .w60, .w50, .w40, .w30, .w20, .w10 { white-space: nowrap; }
.w100 { width: 100%; }
.w90 { width: 90%; }
.w80 { width: 80%; }
.w70 { width: 70%; }
.w60 { width: 60%; }
.w50 { width: 50%; }
.w40 { width: 40%; }
.w30 { width: 30%; }
.w20 { width: 20%; }
.w15 { width: 15%; }
.w10 { width: 10%; }

.tx_start { text-align: start; }
.tx_center { text-align: center; }
.tx_end { text-align: right; }

.red { color: red; }
.green { color: green; }
.blue { color: blue; }
.black { color: black; }
.white { color: white; }
.orange { color: orange; }

.bg_red { background: red; }
.bg_green { background: green; }
.bg_blue { background: blue; }
.bg_black { background: black; }
.bg_white { background: white; }
.bg_orange { background: orange; }

.ks_pink { background: rgba(240, 131, 54, .1) }
.ks_gray { background: #f2f2f2 }

img.full { width: 100%; height: auto; }
img.png { padding-top: 4px; width: auto; max-height: 40px;}
.decimal {
    margin: 1em 0 0 2em; 
    list-style: decimal;
}
.orgSquare {
    margin: 1em 0 0 2em; 
    list-style: url(orgSquare.png?b);
}
.orgSquare li { margin-top: 1.5em; }

table { width: 100%; }
tr { border-top:1px solid #c9c9c9; }
tr:last-child { border-bottom: 1px solid #c9c9c9; }

th, td {
    padding: 19px 20px 21px;
    vertical-align: middle;
}
th { white-space:nowrap; }
table.classification {
    margin-bottom: 3em;
}
.classification h2 { font: 600 1.6em "Noto Sans JP", sans-serif; }
.classification h3 { font: 400 1.3em "Noto Sans JP", sans-serif; }
.classification p {
    margin: .5em 0;
    font-size: .9em;
}
.classification td:nth-child(2) { font-size: .8em; text-align: right; }
.classification td:nth-child(3), .classification td:nth-child(4) {
    font-size: .66em;
    text-align: center;
}
.application td:first-child { background: #f2f2f2; }

.sideMenu h2 {
    padding: 10px;
    font-size: 1.4em;
    border-top: 2px solid #d0d0d0;
    background:#f2f2f2;
    position:relative; 
}
.sideMenu h2::before {
    content:"";
    position:absolute;
    top:-2px;
    left:0;
    width:15%;
    height:2px;
	background-color:#dc7308;
}
.sideMenuList > li > a {
    display: block;
    padding: 10px;
    position:relative;
}
.sideMenuList > li > a::before {
    content:">";
    position:absolute;
    top: 10px;
    right: 15px;
	margin:auto;
}
.sideMenuList > li:last-child {
    border-bottom: 1px solid #d0d0d0;
}

.agui {
    position: relative;
    display: flex;
    align-items: center;
    padding: 21px 20px 19px;
    width: calc( 100% - 40px );
    margin: 2.5em auto;
    background:#f8f8f8;
    font-size: .8em;
/*    border-top: 1px solid #d0d0d0;
    border-bottom: 1px solid #d0d0d0;   */
}
.agui a img:not(.png) {
	max-width: 25vw;
}
/*
.agui a img:not(.png) {
	width: 110px;
	height: 80px;
	object-fit: cover;
    object-position: 50% 12%
}
.afrm_btn {
    position: relative;
    width: 100%;
    margin: 2.5em auto;
    border: 1px solid #d0d0d0;
    box-shadow: 7px 7px rgba(220, 115, 8, 1);
}
.afrm_btn { background: rgba(240, 131, 54, .1); }
.afrm_btn a {
    position: relative;
    display: flex;
    gap: 1em;
    padding: 40px 30px;
    overflow: hidden;
    z-index: 1;
    font: 400 1.3em "Noto Sans JP", sans-serif;
    color: #333333;
}
.afrm_btn a::after {
    position: absolute;
    content: '';
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    transform: translateX(-100%);
    transition: all .5s ease;
}
.afrm_btn a::after { background-color: #f2f2f2; }
.afrm_btn a:hover::after {
    -webkit-transform:translateX(0);
    transform:translateX(0);
}   */

h1.subHead {
    font: 300 2.8em/1em "Noto Serif JP", serif;
    text-align: center;
}

.afrmContent {
    margin-top: 20px;
    padding: 20px;
    border: 1px solid #c9c9c9;
    border-radius: .5em;
    text-align: center;
}
.afrmIF {
    justify-content: center;
    align-items: center;
}
input[type="text"] {
    width: 10em;
    max-width: 50%;
    margin: 1em .5em;
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
    border-left: 2px solid #de3225;
    font: inherit;
    font-size: 16px;
    font-family: inherit;
  }

button {
    margin: 0;
    padding: .5em 2em;
    border: 1px solid #c9c9c9;
    border-radius: 2em;
    background: white;
    color: #191970;
    font-size: 1.2em;
    box-shadow: 0 3px 0 #d0d0d0;
    transition: .1s;
}
.afrm button {
    width: 100%; padding: 28px 20px 32px;
    font: 400 1.2em "Noto Sans JP", sans-serif;
/*  background: rgba(240, 131, 54, .2); */
    background: red;
    color: white;
    text-align: center;
    border-radius: 20px;
}

button[type="submit"] {
    background: orange;
}
button:hover {
    background: #f2f2f2;
    color: #191970;
    transform: translateY(3px);
    box-shadow: 0 0 0 #d0d0d0;
}
.text-center { text-align: center; }
.pc {display: block; margin: auto 0}
.mp {display: none;}

/*===============================================
●画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:639px){
	html,body{
		font-size: .86em;
		line-height: 1.2em;
	}
    .content {
        padding: 30px 0;
    }
    #main, #side { width: 100%; margin: auto; }
    #side { margin-top: 40px; }
    header h1 small { margin-left: 0; }
/*    .w100, .w90, .w80, .w70, .w60 { width: 100%; }    */
/*    .w50, .w40, .w30, .w20, .w10 { width: 50%; }  */

    th, td { padding: 10px; }
    .classification h2 { font-size: 1.2em; }
    .classification h3 { font-size: 1.1em; }
    .classification td:nth-child(2) { display: none; }
    .afrm button {
        padding: 14px 10px 16px;
        border-radius: 30px;
        font-size: 1.5em;
    }

	footer {
		position: relative;
		margin: 0 auto;
		padding: 0;
		width: 100%;
	}
    .footerInner {
        padding: 30px 0;
    }
    .footerInner img { margin-bottom: 1em; width: 33%; }

	.pc {display: none;}
	.mp {display: block;}

}	/* 必須 */