@charset "utf-8";

/*********************
COMMON STYLES
*********************/

/* 汎用色 */
.fc-pink { color: #ED8399; }
.fc-bgren { color: #62BFA9; }
.fc-dgren { color: #659933; }
.fc-purple { color: #A587BD; }
.fc-yellow { color: #F5AD56; }
.fc-water { color: #5CB7E7; }
.fc-sred { color: #C70852; }
.fc-gray { color: #999; }

.bg-main { background-color: #2E81B7; }
.bg-pink { background-color: #ED8399; }
.bg-bgren { background-color: #62BFA9; }
.bg-dgren { background-color: #659933; }
.bg-purple { background-color: #A587BD; }
.bg-yellow { background-color: #F5AD56; }
.bg-water { background-color: #5CB7E7; }
.bg-sred { background-color: #C70852; }
.bg-white { background-color: #fff; }
.bg-gray { background-color: #999; }

.bdr-main { border-color: #2E81B7; }
.bdr-pink { border-color: #ED8399; }
.bdr-bgren { border-color: #62BFA9; }
.bdr-dgren { border-color: #659933; }
.bdr-purple { border-color: #A587BD; }
.bdr-yellow { border-color: #F5AD56; }
.bdr-water { border-color: #5CB7E7; }
.bdr-sred { border-color: #C70852; }
.bdr-gray { border-color: #999; }


/* 文字サイズ */
.fs-huge {
	font-size: 150%; }
.fs-xlarge {
	font-size: 125%; }
.fs-large {
	font-size: 112.5%; }
.fs-medium {
	font-size: 100%; }
.fs-small {
	font-size: 87.5%; }

.ls01 {
	letter-spacing: .1em; }
.ls02 {
	letter-spacing: .2em; }

.txCenter { text-align: center; }
.txRight { text-align: right; }
.txLeft { text-align: left; }

table.cellcenter * { text-align: center; }
table.cellmiddle * { vertical-align: middle !important; }
table.tdcenter td { text-align: center; }
table.tdright td { text-align: right; }
table.thcenter th { text-align: center; }
table.thright th { text-align: right; }

img.alignleft {
  margin-right: 1.5em;
	margin-bottom: 1em;
  display: inline;
  float: left; }

img.alignright {
  margin-left: 1.5em;
	margin-bottom: 1em;
  display: inline;
  float: right; }

img.aligncenter {
  margin-right: auto;
  margin-left: auto;
	margin-bottom: 1em;
  display: block;
  clear: both; }

img.dropshadow {
	box-shadow: 0 1px 4px #ccc;
}
a:hover img.dropshadow {
	box-shadow: 0 1px 4px #999;
}

.im-caption { text-align:center; font-size: .875em; margin-bottom: 1rem; }
.im-caption img { margin-bottom:.5rem; }


@media (max-width: 40em) {
img.alignleft, img.alignright {
	float: none;
	display: block;
  margin-right: auto;
  margin-left: auto;
  clear: both; }
}

/***** margin *****/
/* bottom */
.mgb00 { margin-bottom: 0 !important; }
.mgb03 { margin-bottom: 0.3em !important; }
.mgb05 { margin-bottom: 0.5em !important; }
.mgb10 { margin-bottom: 1em !important; }
.mgb15 { margin-bottom: 1.5em !important; }
.mgb20 { margin-bottom: 2em !important; }
.mgb30 { margin-bottom: 3em !important; }
.mgb40 { margin-bottom: 4em !important; }
.mgb50 { margin-bottom: 5em !important; }

/* top */
.mgt00 { margin-top: 0 !important; }
.mgt05 { margin-top: 0.5em !important; }
.mgt10 { margin-top: 1em !important; }
.mgt15 { margin-top: 1.5em !important; }
.mgt20 { margin-top: 2em !important; }
.mgt25 { margin-top: 2.5em !important; }
.mgt30 { margin-top: 3em !important; }
.mgt40 { margin-top: 4em !important; }
.mgt50 { margin-top: 5em !important; }

.mgt-05 { margin-top: -0.5em !important; }
.mgt-10 { margin-top: -1em !important; }
.mgt-15 { margin-top: -1.5em !important; }
.mgt-20 { margin-top: -2em !important; }

/* left */
.mgl05 { margin-left: 0.5em !important; }
.mgl10 { margin-left: 1em !important; }
.mgl15 { margin-left: 1.5em !important; }
.mgl20 { margin-left: 2em !important; }
.mgl30 { margin-left: 3em !important; }

@media (max-width:640px) {
	/* bottom */
	.mgb00 { margin-bottom: 0 !important; }
	.mgb03 { margin-bottom: 3px !important; }
	.mgb05 { margin-bottom: 5px !important; }
	.mgb10 { margin-bottom: 10px !important; }
	.mgb15 { margin-bottom: 15px !important; }
	.mgb20 { margin-bottom: 20px !important; }
	.mgb30 { margin-bottom: 30px !important; }
	.mgb40 { margin-bottom: 40px !important; }
	.mgb50 { margin-bottom: 50px !important; }

	/* top */
	.mgt00 { margin-top: 0 !important; }
	.mgt05 { margin-top: 5px !important; }
	.mgt10 { margin-top: 10px !important; }
	.mgt15 { margin-top: 15px !important; }
	.mgt20 { margin-top: 20px !important; }
	.mgt25 { margin-top: 25px !important; }
	.mgt30 { margin-top: 30px !important; }
	.mgt40 { margin-top: 40px !important; }
	.mgt50 { margin-top: 50px !important; }

	.mgt-05 { margin-top: -5px !important; }
	.mgt-10 { margin-top: -10px !important; }
	.mgt-15 { margin-top: -15px !important; }
	.mgt-20 { margin-top: -20px !important; }

	/* left */
	.mgl05 { margin-left: 5px !important; }
	.mgl10 { margin-left: 10px !important; }
	.mgl15 { margin-left: 15px !important; }
	.mgl20 { margin-left: 20px !important; }
	.mgl30 { margin-left: 30px !important; }
}

/* TABLE */
.table-default {
	border-top: solid 1px #ccc;
	border-left: solid 1px #ccc;
}
.table-default th,
.table-default td {
	border-right: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	padding: 1.4em 2em;
}
.table-default thead th {
	background-color: #d7e2ea;
}
.table-default tbody th {
	background-color: #e8ecef;
}
@media (max-width:640px) {
	.table-default th,
	.table-default td {
		padding: .8em 1.2em;
	}
}

/* 括弧番号リスト */
ol.kakkonum {
	list-style: none;
	margin-left: 0 !important;
	padding-left: 0;
}
ol.kakkonum > li{
  counter-increment: cnt;
	position:relative;
	padding-left: 2em;
}
ol.kakkonum > li:before{
  display: inline-block;
	position:absolute;
	top:0; left:0;
	width: 2em;
  content: "(" counter(cnt) ") ";
}

/* ○数字 */
ol.marunum { list-style: none; margin-left: 0 !important; padding-left: 0; }
ol.marunum > li { position: relative; padding-left: 1.5em; }
ol.marunum > li:before { position:absolute;top:0;left:0em; }
ol.marunum > li:nth-child(1):before { content:'\2460'; }
ol.marunum > li:nth-child(2):before { content:'\2461'; }
ol.marunum > li:nth-child(3):before { content:'\2462'; }
ol.marunum > li:nth-child(4):before { content:'\2463'; }
ol.marunum > li:nth-child(5):before { content:'\2464'; }
ol.marunum > li:nth-child(6):before { content:'\2465'; }
ol.marunum > li:nth-child(7):before { content:'\2466'; }
ol.marunum > li:nth-child(8):before { content:'\2467'; }
ol.marunum > li:nth-child(9):before { content:'\2468'; }
ol.marunum > li:nth-child(10):before { content:'\2469'; }

/* 字下げリスト */
.jisage-list { margin-left:0; list-style:none; padding-left: 0; }
.jisage-list li { padding-left: 1em; text-indent:-1em; margin-bottom: .5em; }
.jisage-list li:first-letter { display:inline-block; width: 1em; }

/* インラインリスト */
.list-inline {
	margin-left: 0;
	padding-left: 0;
	list-style: none; }
.list-inline li {
	display: inline-block;
	margin: 0 1.2em .5em 0; }



/*
<ul class="kaku-list">	■リスト
<ul class="maru-list">	●リスト
<ul class="kome-list">	※リスト
<ul class="pdf-list">	PDFリスト
<ul class="free-link">　リンクリスト
<ul class="ext-link">　外部リンクリスト
*/
.kaku-list, .maru-list, .pdf-list, .kome-list, .free-link, .ext-link {
	list-style: none; margin-left: 0.2em; padding-left: 0; }
.kaku-list > li, .maru-list > li, .pdf-list > li, .kome-list > li, .free-link > li, .ext-link > li,
.kaku-para p, .maru-para p {
	position: relative; padding-left:1.4em; }
.kaku-list > li:after, .maru-list > li:after, .pdf-list > li:after, .kome-list > li:after,
.kaku-para p:after, .maru-para p:after {
	display:inline-block; width: 1.2em; position: absolute; top:0; left:0; text-align: center; }
.kaku-list > li:after, .kaku-para p:after { content:'■'; color: #0c3280; }
.maru-list > li:after, .maru-para p:after { content:'●'; color: #0c3280; }
.kome-list > li:after { content:'※'; }
.free-link > li:after {
	position: absolute;
	top: .7em; left: .3em;
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 4px 0 4px 8px;
	border-color: transparent;
	border-left-color: #0c3280;
}
.ext-link > li:after,
.ext-link > li:before {
	position: absolute;
	content: '';
	width: 11px;
	height: 9px;
	border: solid 2px #fff;
	background-color: #0c3280;
}
.ext-link > li:before {
	top: 11px; left: -1px;
	z-index: 2;
}
.ext-link > li:after {
	top: 8px; left: 2px;
	z-index: 1;
}
.pdf-list > li:after,
.pdf-list > li:before {
	position: absolute;
	content: '';
}
.pdf-list > li:before {
	border: solid 1px #888;
	background: #fff;
	width: 10px;
	height: 13px;
	top: 8px; left: 0;
}
.pdf-list > li:after {
	width: 8px;
	height: 4px;
	top: 15px; left: 6px;
	background: red;
}



/* 段組リスト */
ul.col-list { margin-left: 0; list-style:none;}
@media (min-width: 40em) {
ul.col-list li { float: left; }
ul.col-50p li { width:50%; }
ul.col-33p li { width:33.3%; }
ul.col-25p li { width:25%; }
}


/* 段組DL */
.col-list:after { content: ""; display: table; clear: both; }
dl.col-list > dt { float: left; clear: left; }
dl.col-list.col-dtr > dt { text-align:right; }
dl.col-list > dd { overflow:hidden; margin-bottom: .3em; }
dl.col-3em > dt { width: 3em; margin-right: .6em; }
dl.col-4em > dt { width: 4em; margin-right: .6em; }
dl.col-5em > dt { width: 5em; margin-right: .8em; }
dl.col-8em > dt { width: 8em; margin-right: 1em; }
dl.col-10em > dt { width: 10em; margin-right: 1.4em; }
dl.col-12em > dt { width: 12em; margin-right: 1.4em; }
@media (max-width: 40em) {
dl.col-list > dt { float: none; width: auto; margin-right:0; font-weight: 700; color: #444; }
}



/* ぶちぬき */
.full-width-text {
	box-sizing: border-box;
	margin-left: calc(((100vw - 100%) / 2) * -1);
	margin-right: calc(((100vw - 100%) / 2) * -1);
	padding: 4rem calc((100vw - 100%) / 2);
	margin-top: 4rem;
	margin-bottom: 4rem;
	background-color: #333;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	color: #fff;
	clear: both;
}
.full-width-text>*:last-child {
	margin-bottom: 0;
}
.full-width-images {
	margin-left: calc(((100vw - 100%) / 2) * -1);
	margin-right: calc(((100vw - 100%) / 2) * -1);
	margin-top: 4rem;
	margin-bottom: 4rem;
	background-color: #333;
	text-align:center;
	clear: both;
}
.full-width-images>img {
	width:100%;
	height:auto;
}


/* テキストリンクに三点リーダー */
.morelink {
	position: relative;
	font-weight: bold;
	display: inline-block;
	padding: .5em 3em .4em 0;
	color: #000;
}
.morelink .uk-icon-button {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	color: #000;
	background: #fff;
	border: solid 1px #ccc;
}


/* ボタンに右矢印 */
.icon-right,
.icon-down {
	position: relative;
	padding: 0 42px;
}
.icon-right:before,
.icon-right:after,
.icon-down:before,
.icon-down:after {
	content: '';
  position: absolute;
	width: 8px;
	height: 1px;
	background: #fff;
}
/* 右 */
.icon-right:before,
.icon-right:after { top: 49%; right: 14px; transform-origin: right center; }
.icon-right:before { transform: rotate(-45deg); }
.icon-right:after { transform: rotate(45deg); }
/* 下 */
.icon-down:before { top: 49%; right: 12px; transform-origin: right top; }
.icon-down:after { top: 49%; right: 20px; transform-origin: left top; }
.icon-down:before { transform: rotate(-45deg) translateY(-4px); }
.icon-down:after { transform: rotate(45deg) translateY(-4px); }


/* ボタンに汎用背景色をセットした時のHover */
.uk-button.bg-pink:focus,
.uk-button.bg-pink:hover {
	background-color: #DB6079;
}
.uk-button.bg-bgren:focus,
.uk-button.bg-bgren:hover {
	background-color: #3AAF93;
}
.uk-button.bg-dgren:focus,
.uk-button.bg-dgren:hover {
	background-color: #50821F;
}
.uk-button.bg-purple:focus,
.uk-button.bg-purple:hover {
	background-color: #8C67AA;
}
.uk-button.bg-yellow:focus,
.uk-button.bg-yellow:hover {
	background-color: #EC9730;
}
.uk-button.bg-water:focus,
.uk-button.bg-water:hover {
	background-color: #34A0D9;
}
.uk-button.bg-sred:focus,
.uk-button.bg-sred:hover {
	background-color: #AB0244;
}

.uk-button.lab-btn-ras,
.uk-button.lab-btn-dot {
	display:block;
	font-weight: 700;
	padding: 5px 10px;
	line-height: 1.4;
	border-radius: 4px;
	position:relative; }
.uk-button.lab-btn-ras { background-image: url(../images/raster.png); }
.uk-button.lab-btn-dot { background-image: url(../images/raster_dot.png); }
.uk-button.lab-btn-ras:after,
.uk-button.lab-btn-dot:after {
	content: '';
	position:absolute;
	top:5px; right:5px; bottom:5px; left: 5px;
	border-radius: 2px;
	border: solid 1px #fff; }