@charset "UTF-8";

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

	for all
	
===============================================================*/

/*--------------------------------------------------------------
	Layout Settings
---------------------------------------------------------------*/
#wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
    height: 100%;
	min-height: 100vh;
}
#wrapper:after {
	clear: both;
	content: '';
	display: block;
	height: 0;
}

#grid {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

#wrapper header * ul > li,
#wrapper footer * ul > li {
	list-style: none;
}
#wrapper footer * ul > li {
	padding: 0px;
}
#wrapper footer {
	margin: auto 0px 0px;
}

/*==============================================================
	Header Kinkyu Alert
===============================================================*/

/*	 Obi
---------------------------------------------------------------*/
#header {
	margin-top: 40px;
}

#alert-header {
	/*position: fixed;*/
	position: relative;
	top: 0;
	display: flex;
	align-items: center;
	width: 100%;
	padding: 0px 20px;
	font-size: 16px !important;
	background-color: yellow;
	z-index: 10000 !important;
}

#alert-header .alert-head {
	min-width: 70px;
	color: red;
	font-weight: bold;
	padding: 7px 0;
	margin: 0px;
}

#alert-header .alert-body {
	padding: 7px 0;
	margin: 0px 15px;
	cursor: pointer;
}
#alert-header .alert-body:hover {
	text-decoration: underline;
}

#alert-header .alert-close-button {
	position:relative;
	cursor: pointer;
	display:inline-block;
	width: auto;
	min-width: 60px;
	padding: 0px 5px 0px 5px;
	margin: 0 0 0 auto;
	font-size: 13px;
	text-align: center;
	border: 2px solid #dd0;
	transition: all 0.3s;
	background-color: #fff;
}

#alert-header .alert-close-button:hover {
}

#alert-header .clearfix {
	clear: both;
}

@media only screen and (max-width: 767px) {
#alert-header {
	display: block;
	padding: 0px 10px;
}
#alert-header .alert-head {
}

#alert-header .alert-body {
	padding: 0px;
	margin: 0px auto 10px;
	font-size: 0.9em;
}
#alert-header .alert-close-button {
	position: absolute;
	top: 7px;
	right: 10px;
}
}

/*	 Popup Window
---------------------------------------------------------------*/
#alert-popup {
	position: fixed;
	top: 0;
	left: 0;
	display: none;
	width: 100%;
	height: 100vh;
	transition: all 0.3s;
	background: transparent;
	z-index: 1000;
	opacity: 0;
}

#alert-popup .background {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	opacity: 0.8;
	z-index: -1;
}

#alert-popup .inner {
	width: 90%;
	max-width: 600px;
	margin: 150px auto 0;
}

#alert-popup .alert-head {
	margin-bottom: 20px;
	font-size: 24px;
	font-weight: bold;
}

#alert-popup .alert-body {
	margin-bottom: 60px;
	font-size: 20px;
}

#alert-popup .alert-close-button {
	width: 150px;
	margin: 0 auto;
	padding: 10px 20px;
	text-align: center;
	font-size: 20px;
	border: 2px solid #DDD;
	border-radius: 5px;
	transition: all 0.3s;
	background-color: #fff;
	cursor: pointer;
}

#alert-popup .alert-close-button:hover {
	background-color: yellow;
}

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

	Header
	
===============================================================*/

header {
	position:relative;
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
	border-top: 3px solid #009dff;
	z-index: 10;
}

header .headerTop {
	display: block;
	width: 100%;
	max-width: 960px;
    padding: 0px 0px 20px;
	margin: 0 auto;
	overflow: hidden;
	*zoom: 1;
}

/*	 Logo
---------------------------------------------------------------*/
header .siteTitle {
	position:relative;
    display: inline-block;
	padding: 0px;
	margin: 0px;
}
header .siteTitle a{
    display: block;
	width: 100%;
}
header .siteTitle a img {
    display: block;
	width: 100%;
	max-width: 100%;
}

@media only screen and (min-width: 979px) {
header .siteTitle a {
	position:relative;
	padding: 0px 10px;
	background: #FFF;
	background: -moz-linear-gradient(top,  #FFF 0%, #efefef 100%);
	background: -webkit-linear-gradient(top,  #FFF 0%,#efefef 100%);
	background: linear-gradient(to bottom,  #FFF 0%,#efefef 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFF', endColorstr='#efefef',GradientType=0 );
	border: 2px solid #e7e7e7;
}
header .siteTitle a:before {
	position:absolute;
	left: 0px;
	top: 0px;
	content: "";
	display:block;
	width: 100%;
	height: 100%;
	border: 1px solid #FFF;
	box-sizing:border-box;
}

header .Lang {
	display: none;
}
	
}

/*	 Address
---------------------------------------------------------------*/
header .address {
	font-size: 0.8em;
}
header .address .btn {
	display: inline-block;
	margin-left: 10px;
}
header .address .btn a {
	position:relative;
	display: inline-block;
	padding-left: 10px;
}
header .address .btn a:before {
	position: absolute;
	top: 50%;
	left: 0px;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #333;
	
	content: "\f0da";
}

@media only screen and (max-width: 979px) {
	
#wrapper {
	overflow:hidden;
}

body.menuOpen #wrapper{
	padding-top:60px;
	position: fixed;/* メニュー開いたときコンテンツをスクロールさせない */
}

/* メニュー開いたときコンテンツのレイアウト崩れを隠す */
body.menuOpen #wrapper:before {
	display:block;
	width: 100%;
	height: 100%;
	position:absolute;
	top: 0;
	left: 0;
	background:#FFF;
	content: "";
	z-index: 1000;
}

/*----- オープン時のレイヤー -----*/
.overlay {
	display: none;
	background-color: rgba(0,0,0,0.2);
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 1000;
}

header {
	position:relative;
	height: 60px;
	padding:0;
	box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.1);
	z-index: 10000;
}
body.menuOpen header{
	position: fixed;
	top:0;
	width: 100%;
}

header .headerTop {
	width: 100%;
	max-width: 95%;
	margin: 0px auto;
}

/*	 Logo
---------------------------------------------------------------*/
header .headerTop {
	padding: 0px;
}
header .siteTitle {
	max-width: 170px;
}
header .siteTitle a{
	line-height: 60px;
}

header .siteTitle a img {
	width:100%;
}

header .address {
	display: none;
}

/*	 Language
---------------------------------------------------------------*/
header .Lang {
	position: absolute;
	top: 6px;
	right: 57px;
}
header .Lang a {
	position: relative;
	display:block;
	width: 45px;
	height: 45px;
	z-index: 1000;
}
header .Lang:before {
	position: absolute;
	top: 50%;
	left: 50%;
	display: inline-block;
	width: auto;
	-webkit-transform: translate(-50% ,-50%);
	transform: translate(-50% ,-50%);
	font-family:"Line Awesome Free","Line Awesome Brands";
	font-weight: 900;
	font-size: 35px;
	color: #333;
	
	content: "\f1ab";
	z-index:100;
}

}

/*--------------------------------------------------------------
	Groval nav
---------------------------------------------------------------*/

.navDrawr {
	background: #FFF;
}

/*	 Main Link
---------------------------------------------------------------*/
.navDrawr .gnav {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background: #FFF;
	background: -moz-linear-gradient(top,  #FFF 0%, #f6f6f6 47%, #ededed 100%);
	background: -webkit-linear-gradient(top,  #FFF 0%,#f6f6f6 47%,#ededed 100%);
	background: linear-gradient(to bottom,  #FFF 0%,#f6f6f6 47%,#ededed 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFF', endColorstr='#ededed',GradientType=0 );
}
.navDrawr .gnav > ul {
    display: flex;
    justify-content: space-between;
		
	width: 100%;
	max-width: 960px;
	margin: 0px auto;
	text-align:center;
}
.navDrawr .gnav > ul:after {
    content: "";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}

.navDrawr .gnav > ul > li {
    position: relative;
    display: block;
	
	width : -webkit-calc(100% / 7);
	width : calc(100% / 7);

	margin: 0px auto;
	text-align:center;
	list-style: none;
	border-right: 1px solid #ccc;
}
.navDrawr .gnav ul li {
	padding: 0;
	list-style: none;
}
.navDrawr .gnav > ul > li:first-child {
	border-left: 1px solid #ccc;
}

.navDrawr .gnav > ul > li > a {
    display: flex;
	align-items:center;
	justify-content:center;

	
	width: 100%;
	height: 100%;
	margin: 0px auto;
	
	color: #000;
	font-size: 14px;
	text-decoration: none;
	text-align:center;
	line-height: 1.4;
}

.navDrawr .gnav a {
	font-size: 0.9em;
    color: #FFF;
    text-decoration: none;
}

@media only screen and (min-width: 979px) {

.navDrawr .gnav > ul > li {
	padding: 10px;
}

.navDrawr .gnav > ul > li > a:after {
	position:absolute;
	left: 0px;
	bottom: 1px;
	content:"";
	display:block;
	width: 100%;
	height: 3px;
	background:#009dfc;
}

.navDrawr .gnav > ul > li > a:hover {
	color: #0071bd;
}
.navDrawr .gnav > ul > li > a:hover:after {
	background:#0071bd;
}

}

/*	 Sub Link
---------------------------------------------------------------*/
/*
.navDrawr .sub {
	display: none
}
.navDrawr .sub li:last-child a {
    border: none;
}
.navDrawr .sub {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 9999;
}
*/
.navDrawr .sub a {
	position:relative;
    padding: 10px 10px 10px 30px;
	font-size: 0.85em;
	color: #000;
	text-align:left;
    border-bottom: 1px solid #ccc;
    background: #e5e5e5;
}
.navDrawr .sub a:before {
	position: absolute;
	top: 50%;
	left: 10px;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #333;
	
	content: "\f0da";
}

@media only screen and (min-width: 979px) {
.navDrawr .sub a:hover {
	color: #FFF;
    background: #009dfc;
}
.navDrawr .sub a:hover:before {
	color: #FFF;
}
}
 
@media only screen and (max-width: 979px) {

/*--------------------------------------------------------------
	Groval nav
---------------------------------------------------------------*/

/*	 Menu Button
---------------------------------------------------------------*/

.navDrawrBtn {
	text-align: right;
}
.navDrawrBtn span {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 10px;
	margin: auto;
	display: block;
	width: 45px;
	height: 45px;
	cursor: pointer;
}
.navDrawrBtn span::before {
	font-family: FontAwesome;
	content: "\f0c9";
	font-size: 24px;
	color: #000;
	position: absolute;
	left: 0;
	width: 100%;
	text-align: center;
	line-height: 45px;
}
body.menuOpen .navDrawrBtn span::before {
	content: "\f00d";
}

/*	 Main Link
---------------------------------------------------------------*/
.navDrawr {
	position: fixed;
	width: 100%;
	max-width: 100%;
	right: -100%;
	top: 60px;
	bottom: 0;
	/*bottom: 0;*/
	/*
	width: 100vw; //ie,firefoxで効かない
	right: -100vw;
	*/
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	background-color: #FFF;
}

.navDrawr .gnav > ul > li {
	float: none;
	width: auto;
	padding: 0px;
	list-style: none;
}
.navDrawr .gnav > ul > li > a {
	justify-content:flex-start;
	height: auto;
	padding: 20px;
	color: #FFF;
	font-size: 1em;
	border-right: none;
	border-bottom: 1px solid #FFF;
	background:#36C;
}

.navDrawr .gnav {
	border-top: none;
	border-bottom: none;
	background: red;
}
.navDrawr .gnav > ul {
    display: flex;
	flex-direction:column;
    justify-content: flex-start;
		
	width: 100%;
	max-width: 100%;
	text-align:left;
}

.navDrawr .gnav > ul li {
	list-style: none;
	text-align:left;
}
.navDrawr .gnav > ul > li {
	width :100%;
	max-width: 100%;
	min-width: 100%;
	text-align:left;
	border-right: none;
}
.navDrawr .gnav > ul > li:first-child {
	border-left: none;
}


.navDrawr .gnav a {
    display: block;
	font-size: 1em;
    color: #FFF;
    text-decoration: none;
}
.navDrawr .gnav .sub a:before {
	display: none;
}

/*	 Sub Link
---------------------------------------------------------------*/
/*
.navDrawr .sub {
	position: static;
	display: block!important;
}
*/
.navDrawr .sub a {
	position:relative;
    padding: 10px 20px 10px 40px;
	margin: 0px;
	color: #000;
	border-bottom: 1px solid #FFF;
}

.navDrawr .sub a:after {
	position: absolute;
	top: 50%;
	left: 20px;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #333;
	
	content: "\f0da";
}

}

/*	 Gnav Accordion
---------------------------------------------------------------*/
.main {
	position:relative;
	padding: 10px 0px;
	font-size: 0.9em;
}
.main > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: none !important;
	z-index: 1000;
}
.main .title {
	pointer-events: none;
	z-index: 1000;
}
.main .grp {
	position: relative;
	z-index: 10;
	
}

.main .toggle {
	display: none;
}

@media screen and (min-width: 979px){
.webpage {
	display: none;
}
}

@media screen and (max-width: 979px){
.main {
	padding: 0px;
	font-size: 1em;
}
	
.main > a {
	display: none !important;
	z-index: 1;
	
}

.main .title{
	position:relative;
	pointer-events: all;
	
	padding: 15px 20px;
	color: #FFF;
	border-bottom: 1px solid #FFF;
	background:#3366cc;
}

.main .toggle{
	display: none;
}
	
.main .title:after{
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 20px;
    content: "\f13a";
    box-sizing: border-box;
}

.main .title.open:after {
	content: "\f139";
}


.webpage a {
	position:relative;
	justify-content:flex-start;
	height: auto;
	padding: 15px 20px;
	color: #FFF;
	font-size: 1em;
	border-right: none;
	border-bottom: 1px solid #FFF;
	background: #399;
}
.webpage a:after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 20px;
    content: "\f138";
    box-sizing: border-box;
}
	
}


/*--------------------------------------------------------------
	Navi
---------------------------------------------------------------*/

#wrapper .headerNav {
	position:relative;
	width: 100%;
	max-width: 960px;
	margin: 0px auto;
}

#wrapper .headerNav .box {
	position:absolute;
	top: -130px;
	right: 0;
	display: flex;
	justify-content: space-between;
	align-content: space-between;
	flex-wrap: wrap;
	width: 60%;
	height: 110px;
	font-size: 0.9em;
}


@media only screen and (max-width: 979px) {
#wrapper .headerNav {
	max-width: 95%;
}
#wrapper .headerNav .box {
	position: relative;
	top: auto;
	right: auto;
	display: flex;
	justify-content: space-between;
	align-content: space-between;
	flex-wrap: wrap;
	width: 100%;
	
	height: auto;
	
	padding: 20px 10px;
}
}


/*	 Navi - Text Size Change
---------------------------------------------------------------*/
#wrapper .headerNav .box .TextSize {
	display: flex;

	justify-content: flex-end;
	width: 50%;
}
#wrapper .headerNav .box .TextSize p {
	margin: auto 0px;
}
#wrapper .headerNav .box .TextSize ul {
	display: flex;
	align-items: center;
	*zoom: 1;
}

#wrapper .headerNav .box .TextSize ul li {
	display: flex;
	align-items: center;
	
	height: 100%;
	padding: 3px 10px;
	margin-left: 10px;
	list-style: none;
	
	border: 1px solid #ccc;
	cursor: pointer;
}

#wrapper .headerNav .box .TextSize ul li:first-child {
	font-size: 0.8em;
}
#wrapper .headerNav .box .TextSize ul li:nth-child(2) {
	font-size: 0.9em;
}
#wrapper .headerNav .box .TextSize ul li:last-child {
	font-size: 1em;
}

#wrapper .headerNav .box .TextSize ul li:hover {
	background-color: #eee;
}
#wrapper .headerNav .box .TextSize ul li.active {
	color: #FFF;
	background-color: #009dff;
}
#wrapper .headerNav .box .TextSize ul li.active:hover {
	background-color: #999;
}

@media only screen and (max-width: 979px) {
#wrapper .headerNav .box .TextSize {
	display: none;
	/*
	justify-content: flex-end;
	width: 100%;
	margin-bottom: 10px;
	*/
}
}


/*	 Navi - Background Color Change
---------------------------------------------------------------*/
#wrapper .headerNav .box .Color {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: 50%;
}
#wrapper .headerNav .box .Color p {
	margin: auto 0px;
}
#wrapper .headerNav .box .Color ul {
	display: flex;
	align-items: center;
}
#wrapper .headerNav .box .Color ul li {
	margin-left: 10px;
	padding: 0;
}
#wrapper .headerNav .box .Color ul li a {
	display: block;
	padding: 3px 10px;
}
#wrapper .headerNav .box .Color ul li.wh a {
	color: #000 !important;
	border: 1px solid #ccc;
	background:#FFF !important;
}
#wrapper .headerNav .box .Color ul li.bl a {
	color: #f4f400 !important;
	border: 1px solid #f4f400;
	background:#00008b !important;
}
#wrapper .headerNav .box .Color ul li.yl a {
	color: #000 !important;
	border: 1px solid #000;
	background:#f4f400 !important;
}
#wrapper .headerNav .box .Color ul li.bk a {
	color: #f4f400 !important;
	border: 1px solid #f4f400;
	background:#000 !important;
}


@media only screen and (max-width: 979px) {
#wrapper .headerNav .box .Color {
	justify-content: center;
	width: 50%;
}
}

@media only screen and (max-width: 600px) {
#wrapper .headerNav .box .Color {
	width: 100%;
	margin-bottom: 30px;
}

#wrapper .headerNav .box .Color ul li a {
	padding: 10px 15px;
}
}

/*	 Navi - Link
---------------------------------------------------------------*/
#wrapper .headerNav .box .Link {
	display: flex;
	align-items: center;
	width: 50%;
}
#wrapper .headerNav .box .Link span {
	display: inline-block;
	margin-right: 15px;
	color: #000;
}
#wrapper .headerNav .box .Link span a {
	position:relative;
	padding-left: 10px;
}
#wrapper .headerNav .box .Link span a:before {
	position: absolute;
	top: 50%;
	left: 0px;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #333;
	
	content: "\f0da";
}

@media only screen and (max-width: 979px) {
#wrapper .headerNav .box .Link {
	display: none;
	/*
	justify-content: flex-end;
	width: 100%;
	*/
}

}

/*	 Navi - Search
---------------------------------------------------------------*/

/* -------------------------------------------------------------- */
/*  Googole Search
/* -------------------------------------------------------------- */
/* 検索box */
.search {
/*
float: right;
margin: 0;
width: 300px;
*/
}

* html .search form {margin: 0;}

/* 検索box（google 検索boxカスタマイズ） */
table.gsc-search-box {
}

table.gsc-search-box td.gsc-input, table.gsc-search-box td.gsc-search-button, table.gsc-search-box td.gsc-clear-button  {
	padding: 0;
	vertical-align: top;
	-webkit-border: none;
	-moz-border: none;
	border: none;
}
/* 検索結果（google 検索結果カスタマイズ） */
table.gsc-resultHeader, div.gs-webResult.gs-result {
	-webkit-border: none;
	-moz-border: none;
	border: none;
}


/*===== Default =====*/
#gsc{
    position:relative;
	right: 15px !important;
	width: 250px !important;
    margin: 0px 0px 0px auto;
}

/*検索文章入力窓*/
.gsc-input .gsc-input-box {
	background: none !important;
}

/*検索文章入力窓*/
.gsc-input .gsc-input-box:hover {
  box-shadow:0px 4px 6px 0px #c4c4c4 !important;
}

/*検索ボタン*/
/*
.gsc-search-button .gsc-search-button-v2 {
  height: var(--input-height) !important;
  border-radius: var(--input-border-radius) !important;
  box-shadow:0px 0px 0px 0px #c4c4c4 !important;
}
*/
/*検索ボタン*/
/*
.gsc-search-button .gsc-search-button-v2:hover {
  box-shadow:0px 4px 6px 0px #c4c4c4 !important;
}
*/

#gsc td {
	-webkit-border: none;
	-moz-border: none;
	border: none;
}
 
#gsc .gsc-control-cse, 
#gsc .gsc-control-cse-ja,
#gsc .gsib_a{
    margin:0 !important;
    padding:0 !important;
}
/* テキスト入力フォームとボタンの位置 */
#gsc table.gsc-search-box td,
#gsc table.gsc-search-box input {
    vertical-align: top !important;
}
/* テキスト入力フォーム */
#gsc input[type="text"] {
	position:relative;
	width: 250px !important;
    height:30px !important;
    margin-top: 0px;
    border: 1px solid #dddddd !important;
	border-radius: 0px;
}
 
 
#gsc input[type="text"]:focus {
    border: 2px solid #b2e0eb !important;
    outline: 0; /*safariの自動フォーカスを切る */
}
 
/* テキスト入力フォームの影を消す */
#gsc #gsc-iw-id1{
    border:none !important;
}
/* テキスト入力フォームの背景画像位置調整 */
#gsc #gs_tti0 input{
    background-position:5px 5px !important;
}
#gsc #gs_tti0 input{
    background-position:5px 5px !important;
}
/* ボタンの色 */
#gsc input.gsc-search-button {
	background: #d2d2d2 !important;
	background: -ms-linear-gradient(top,  #008ee1 0%,#008ee1 100%);/* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008ee1', endColorstr='#008ee1',GradientType=0 );/* IE6-9 */
	border: 1px solid #d2d2d2 !important;
}
/* ボタンの位置調整と角丸消し */
#gsc .gsc-search-button {
	height: 30px;
    /*margin:0 0 0 -16px !important;*/
    margin:0 0 0 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
	cursor: pointer;
}

/* 入力時に出る「×」ボタンの位置調整 */
 
/* 入力時に出る×ボタン -- Firefox位置調整 -- */
#gsc .gsib_b span{
	position:relative;
        box-sizing: border-box;
   -moz-box-sizing: border-box;
        padding: 0px;
		top: -6px;
		left: -6px;
}


/*===== Custam =====*/
#gsc .gsc-control-cse { padding: 0;}

/* テキストボックスに文字入力したときに出る「×」マークの位置調整用の指定 */
#gsc .gsc-search-box { position: relative;}

#gsc .gsc-search-box tr,
#gsc .gsc-search-box td { display: block;}

/*
#gsc .gsc-search-box .gsc-input-box { background-color: #F3F3F1;}
*/

/* テキストボックスの親要素。width指定しつつfloatで左寄せ */
#gsc .gsc-search-box td.gsc-input,
#gsc .gsc-search-box td.gsc-input .gstl_50 {
	box-sizing: border-box;
	width: 250px !important;
	padding: 0 !important;
	margin-right: 5px;
	height: 30px;
	vertical-align: top;
	float: left;
	
}

#gsc .gsc-search-box .gsib_a {
	width: 250px !important;
	padding: 0 !important;
}

/* テキストボックスのデザイン設定 */
#gsc .gsc-search-box input#gsc-i-id1 {
	box-sizing: border-box;
	/*height: 25px !important;*/
	height: 30px !important;
	padding: 0px !important;
	/*
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	*/
	-webkit-box-shadow: 2px 2px 2px 0 rgba(200,200,200,0.4) inset;
	-moz-box-shadow: 2px 2px 2px 0 rgba(200,200,200,0.4) inset;
	box-shadow: 2px 2px 2px 0 rgba(200,200,200,0.4) inset;
	background-position: 5px center !important;
}

#gsc .gsc-search-box td#gs_tti51 { margin-bottom: 5px;}

/* ボタンの親要素。width指定しつつfloatで左寄せ */
#gsc .gsc-search-box td.gsc-search-button {
	position:absolute;
	top: 0px;
	right: 0px;
	float: right;
	width: 59px !important;
	height: 30px;
}

/* テキストボックスに文字入力したときに出る「×」マークの位置調整 */
#gsc .gsc-search-box .gsib_b {
	position: absolute;
	width: 20px;
	top: 0px;
	right: 70px;
}

/* デフォルトで設定されている(疑似的な)テキストボックスの
デザイン設定を解除 */
#gsc .gsc-search-box .gsc-input-box,
#gsc .gsc-search-box .gsc-input-box-hover,
#gsc .gsc-search-box .gsc-input-box-focus {
	-webkit-border: none !important;
	-moz-border: none !important;
	border: none !important;
	
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
}

/* 検索ボタンの背景をボタンのように見せかける */
/*
#gsc .gsc-search-box .gsc-search-button {
	position: relative;
	background: #3A0527 96% center no-repeat;
	cursor: pointer;
}
*/

/* 検索ボタンの背景部分にテキストを表示させる */
#gsc .gsc-search-box .gsc-search-button:before {
	position: absolute;
	top: 0%;
	left: 30%;
	padding-top: 3px;
	/*content: '検索' !important;*/
	content: '' !important;
	color: #FFF;
	text-align:center !important;
	font-size: 14px;
}

/* 検索ボタンを透明化し背景のみを表示させる */
#gsc .gsc-search-box input.gsc-search-button-v2,
#gsc .gsc-search-box input.gsc-search-button {
	width: 100%;
	height: 30px;
	padding: 0 !important;
	opacity: 0;
}


/* chrome safari opera */
/*
@media only screen and (-webkit-min-device-pixel-ratio: 0) {
#gsc .gsc-search-box input#gsc-i-id1 {
	height: 35px !important;
}

	
    #gsc .gsc-search-button {
		margin-top: 3px !important;
		width: 100%;
		height: 35px;
    }
    #gsc .gsc-search-button .gsc-search-button * {
		position: relative;
		top: -2px;
    }
	
#gsc .gsc-search-box .gsib_b {
	position: absolute;
	width: 20px;
	top: 8px;
	right: 70px;
}

}
*/

/*----- safari -----*/
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    _::-webkit-full-page-media, _:future, :root #gsc .gsc-search-box input#gsc-i-id1 {
		height: 50px !important;
    }
    _::-webkit-full-page-media, _:future, :root #gsc input.gsc-search-button {
		height: 50px;
		background:#F30
    }
    _::-webkit-full-page-media, _:future, :root #gsc .gsc-search-button {
		margin-top: 3px !important;
		width: 100%;
		height: 50px;
    }
    _::-webkit-full-page-media, _:future, :root #gsc .gsc-search-button .gsc-search-button * {
		position: relative;
		top: 0px;
    }
    _::-webkit-full-page-media, _:future, :root #gsc .gsc-search-box .gsib_b {
	position: absolute;
	width: 20px;
	top: 15px;
	right: 85px;
    }
}

@media screen and (max-width: 600px)  and (-webkit-min-device-pixel-ratio: 0) {
    _::-webkit-full-page-media, _:future, :root #wrapper .headerNav .search {
		margin-bottom: 50px;
    }
}


@media only screen and (max-width: 600px) {
#wrapper .headerNav .search {
	display: flex;
	justify-content: center;
	width: 100%;
	margin-bottom: 30px;
}
#gsc{
    position:relative;
	right: auto !important;
	width: 100% !important;
    margin: 0px auto;
}

#gsc input[type="text"] {
	width: 100% !important;
}

#gsc .gsc-search-box td.gsc-input,
#gsc .gsc-search-box td.gsc-input .gstl_50 {
	width: 100% !important;
}

#gsc .gsc-search-box .gsib_a {
	width: 100% !important;
}


}

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

	Contents
	
===============================================================*/

#contents {
	position: relative;
	width: 100%;
	max-width: 100%;
	max-width: 100%;
	margin-top: 40px;
	padding-bottom: 60px;
	overflow: hidden;
	*zoom: 1;
}

#container {
	width:100%;
	max-width: 960px;
	padding: 0px;
	margin: 0 auto;
}
/*----- #container / #left-column 共通 -----*/
	#contents .inner {
		display: flex;
		flex-wrap: wrap;
		justify-content:space-between;
		margin: 0px auto 30px;
	}

#left-column {
	width: 70%;
	min-width: 740px;
	padding-bottom: 20px;
	order: 2;
}

	#left-column .main-column {
		width: 70%;
		max-width: 520px;
		order: 2;
	}
	#left-column .side-column {
		width: 30%;
		max-width: 200px;
		order: 1;
	}

#right-column {
	width: 30%;
	max-width: 200px;
	order: 1;
}

/*----- TOPページのみ　レイアウト順番 -----*/
#contents .top #left-column {
	order: 1;
}
#contents .top #right-column {
	order: 2;
}


@media only screen and (max-width: 979px) {

#contents {
	margin-top: 0px;
	padding-bottom: 30px;
}

#container {
	flex-direction: column;
	max-width: 100%;
}

#contents #container .inner {
	max-width: 100%;
}

#left-column {
	width: 100%;
	max-width: 95%;
	min-width: auto;
	margin: 0 auto;
	padding-bottom: 0;
	order: 1;
}

/*----- TOPページのみ　レイアウト順番 -----*/
#contents .top #left-column {
	max-width: 100%;
}

#contents #left-column .inner {
	max-width: 95%;
}

	#left-column .main-column {
		width: 70%;
		max-width: 100%;
		order: 2;
	}
	#left-column .side-column {
		width: 25%;
		max-width: 100%;
		order: 1;
	}


#right-column {
	width:100%;
	max-width: 100%;
	min-width: auto;
	margin: 30px auto;
	order: 2;
}

#right-column-inner {
	width: 100%;
	max-width: 95%;
	margin: 0px auto;
}

}


@media only screen and (max-width: 767px) {
#left-column .inner {
	flex-direction:column;
}
	
	#left-column .main-column {
		width: 100%;
		max-width: 100%;
		order: 1;
	}
	#left-column .side-column {
		width: 100%;
		max-width: 100%;
		order: 2;
	}


}
/*--------------------------------------------------------------
	all common contents
---------------------------------------------------------------*/

#contents section {
	padding: 0px;
}

.Mb30 {
	margin-bottom: 30px;
}
.Mb60 {
	margin-bottom: 60px;
}
.Mb80 {
	margin-bottom: 80px;
}
.Mb120 {
	margin-bottom: 120px;
}


#contents h1 + p:last-of-type,
#contents > section > p:first-of-type,
#contents > p:first-of-type,
#container > p:first-of-type,
#container > section > p:first-of-type {
	margin-bottom: 40px;
}

#left-column p {
	padding: 0px 10px;
}

#contents section p {
	padding-bottom: 10px;
}

@media only screen and (max-width: 767px) {
	
.Mb30 {
	margin-bottom: 20px;
}
.Mb60 {
	margin-bottom: 30px;
}
.Mb80 {
	margin-bottom: 40px;
}
.Mb120 {
	margin-bottom: 60px;
}

#contents h1 + p:last-of-type,
#contents > section > p:first-of-type,
#contents > p:first-of-type,
#container > p:first-of-type,
#container > section > p:first-of-type {
	margin-bottom: 20px;
}
	

}
@media only screen and (max-width: 479px) {
	
.Mb30 {
	margin-bottom: 15px;
}
.Mb60 {
	margin-bottom: 30px;
}
.Mb80 {
	margin-bottom: 30px;
}
.Mb120 {
	margin-bottom: 50px;
}

/*
#contents h1 + p:last-of-type,
#contents > section > p:first-of-type,
#contents > p:first-of-type,
#container > p:first-of-type,
#container > section > p:first-of-type {
	margin-bottom: 0px;
}
*/
	
}


/*--------------------------------------------------------------
	h,1,2,3 common contents
---------------------------------------------------------------*/
#contents h1 {
	position:relative;
	margin-bottom: 30px;
	padding: 8px 5px 5px 8px;
	
	font-size: calc( 1em + 7px);
	font-weight: 700;
	color:#261408;
	-webkit-text-shadow: 1px 1px 0px #FFF;
	text-shadow: 1px 1px 0px #FFF;
	border-top: 2px solid #0166ff;
	border-bottom: 2px solid #0166ff;
	background: none;
}
#contents h1:before,
#contents h1:after {
	position:absolute;
	left: 0px;
	content: "";
	display:block;
	width: 100%;
	border-top: 1px solid #0166ff;
}
#contents h1:before {
	top: 2px;
}
#contents h1:after {
	bottom: 2px;
}

#contents h2,
#contents .Article h3 {
	margin: 0px auto 30px;
	padding: 0px 7px 0px 7px;
	
	font-size: calc( 1em + 4px);
	font-weight:bold;
	
	border-left: 5px solid #0166ff;
	border-bottom: 1px solid #0166ff;
}
#contents h2 {
	margin: 0px auto 30px;
}

/*-- 記事のみh3はh2と同じデザインでmarginは変更 --*/
#contents .Article > h3 {
	margin: 80px auto 30px;
}
#contents .Article > h3:first-of-type {
	margin: 0px auto 30px;
}

#contents h3,
#contents .Article h4 {
	padding: 0px 10px;
	
	font-size: calc( 1em + 2px);
	font-weight:bold;
	
	border-left: 5px solid #0166ff;
}

#contents h3 {
	margin: 0px auto 10px auto;
}

/*-- 記事のみh4はh3と同じデザインでmarginは変更 --*/
#contents .Article > h4 {
	margin: 50px auto 20px;
}
#contents .Article > h4:first-of-type {
	margin: 0px auto 20px;
}

#contents h4 {
	padding: 0px 15px;
	margin: 0px auto 20px;
	
	font-size: calc( 1em + 2px);
	font-weight:bold;
}
#contents h5 {
	padding: 0px 15px;
	margin: 0px;
	
	font-size: calc( 1em + 2px);
	font-weight:bold;
}
#contents h6 {
	font-size: 1em;
	font-weight:bold;
}



#contents .date {
	color: #999;
	text-align:right;
}
#contents .date time {
	position:relative;
	top: -20px;
}

/*--------------------------------------------------------------
	Bread [ pankuzu ]
---------------------------------------------------------------*/

#bread {
	position: relative;
	width: 100%;
	max-width: 100%;
	padding: 0px;
	margin: 0px auto 20px;
	z-index: 10;
}

#bread ul {
	position: relative;
	width: 100%;
	max-width: 100%;
	top: 0;
	left: 0;
	right: 0;
	margin: 0px auto;
	padding: 0px;
	list-style-type: none;
	font-size: 85%;
}
#bread ul li {
	position:relative;
	display: inline-block;
	margin: 0px 15px 0px 3px;
	padding: 0;
	list-style: none;
}
	#bread ul li:after {
		display: inline-block;
		position: absolute;
		top: 50%;
		right:  -10px;
		-webkit-transform: translate(100%, -50%);/* Safari用 */
		transform: translate(100%, -50%);
		font-size: 1em;
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		content: "\f105";
	}
	#bread ul li:last-child:after {
		display:none;
	}
		
@media only screen and (max-width: 979px) {
#bread {
	top: 10px;
}

#bread ul {
	padding: 0px 0px;
}

#bread ul {
	display:block;
	
/*-- テキストが長いときスライドさせる --*/
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	overflow-scrolling: touch;
	overflow: auto;
	white-space: nowrap;
}
#bread li {
	display:inline;
	flex: 0 0 40%;
}
}
		
/*--------------------------------------------------------------
	Contents Box
---------------------------------------------------------------*/
[class^="Box"] {
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-justify-content: center;/* 横方向中央揃え（Safari用） */
	justify-content: center;/* 横方向中央揃え */
	
	width: 100%;
	margin: 50px auto;
}
[class^="Box"] img {
	width: 100%;
	max-width: 100%;
}

.Box {
	max-width: 100%;
}
.Box90 { max-width: 90%;}
.Box80 { max-width: 80%;}
.Box70 { max-width: 70%;}
.Box60 { max-width: 60%;}
.Box50 { max-width: 50%;}
.Box40 { max-width: 40%;}
.Box30 { max-width: 30%;}
.Box20 { max-width: 20%;}
.Box10 { max-width: 10%;}

/*--------------------------------------------------------------
	TOP News
---------------------------------------------------------------*/
.news {
	width: 100%;
	margin: 0px auto 10px;
}

@media all and (min-width: 767px) {
	
.news dl {
	position:relative;
	display:block;
	max-width: 1000px;
	margin: 0px auto 10px;
	padding:0px;
}
.news dt,
.news dd {
	padding: 10px;
}
.news dt:first-of-type,
.news dd:first-of-type {
	padding-top: 0px;
}
.news dt {
	clear:both;
	float:left;
	padding-right: 30px;
}
.news dd {
	width: 100%;
	border-bottom: 1px dashed #9a9a9a;
}
}

@media only screen and (max-width: 1010px) {
.news dl {
	max-width: 95%;
}

}
@media only screen and (max-width: 767px) {
.news {
	margin: 30px auto;
	max-width: 95%;
}
	
.news dl {
	padding: 0px 10px;
}
.news dt {
	margin-bottom: 5px;
	font-weight:bold;
}
.news dd {
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px dashed #ccc;
}

.news .s_btn_r {
	text-align:center;
	padding: 10px;
}
.news .s_btn_r a {
	padding: 10px 50px 10px 25px;
	font-size: 100%;
}

}

/*	 time
---------------------------------------------------------------*/
.NewsTime {
	position:relative;
	width: 100%;
	margin: 0px auto;
	text-align:right;
}
.NewsTime time {
	position: absolute;
	top: -20px;
	right: 0;
	width: auto;
	margin:0px auto;
	font-size: 80%;
}

@media only screen and (max-width: 479px) {
  .NewsTime {
	  position:relative;
	  margin: 0px auto 10px;
  }
  .NewsTime time {
	  position: relative;
	  top: -10px;
  }
}

/*--------------------------------------------------------------
	Another Contents [ Article ]
---------------------------------------------------------------*/
#contents .another-content {
	border: 1px solid #ccc;
}
#contents .another-content h3 {
	margin-bottom: 30px;
	padding: 7px 20px;
	border-left: none;
	border-bottom: 1px solid #ccc;
}
#contents .another-content .list_mark {
	padding: 0px 20px 0px 10px;
}

/*--------------------------------------------------------------
	Live Banner
---------------------------------------------------------------*/
#wrapper .LiveBnr {
	display:block;
	margin: 0px auto 30px;
	overflow:hidden;
}

#wrapper .LiveBnr a {
	position:relative;
	display:block;
	min-height: 140px;
	color: #000 !important;
	text-decoration: none !important;
	border: 1px solid #00489c;
	background:url(../img/livebnr_bg.jpg) no-repeat 0% 100% #FFF !important;
	background-size: contain;
	overflow:hidden;
}

/*	 tittle
-----------------------------------*/
#wrapper .LiveBnr a .ttl {
	display: flex;
	justify-content:space-between;
	align-items: center;
	width: 100%;
	background: #00489c;
}
#wrapper .LiveBnr a .ttl p {
	display: inline-block;
	width: 100%;
	padding: 5px 10px;
	color: #FFF;
	font-size: 0.9em;
}
#wrapper .LiveBnr a .ttl p:first-child {
	width: auto;
	min-width: 180px;
}

#wrapper .LiveBnr a .ttl p:nth-child(2) {
	background: #0168b7;
}
#wrapper .LiveBnr a .ttl p:nth-child(2) span {
	font-size: 1.3em;
}

/*	 List
-----------------------------------*/
#wrapper .LiveBnr a ul {
	display: flex;
	justify-content:space-between;
	padding: 10px;
}
#wrapper .LiveBnr a ul li {
	position:relative;
	margin-right: 20px;
	padding-left: 1.25em;
	list-style: none;
	text-shadow: 
	#FFF 1px 1px 0, #FFF -1px -1px 0,
	#FFF -1px 1px 0, #FFF 1px -1px 0,
	#FFF 0px 1px 0, #FFF  0-1px 0,
	#FFF -1px 0 0, #FFF 1px 0 0;
}
#wrapper .LiveBnr a ul li:last-child {
	margin-right: 0px;
}
#wrapper .LiveBnr a ul li:before {
	position:absolute;
	top: 0px;
	left: 0px;
	color: #22ac38;
	font-family: "Font Awesome 5 Free";
	content: "\f14a";
}

/*	 Deadline / Button
-----------------------------------*/
#wrapper .LiveBnr a .groupe {
	position:absolute;
	bottom: 0px;
	right: 0px;
	display: flex;
	/*/flex-direction: column;*/
	justify-content:flex-end;
	align-items: flex-end;
}

/*	 Deadline
-----------------------------------*/
#wrapper .LiveBnr a .deadline {
	display:inline-block;
	margin-bottom: 5px;
	font-size: 0.8em;
	
	text-shadow: 
	#FFF 1px 1px 0, #FFF -1px -1px 0,
	#FFF -1px 1px 0, #FFF 1px -1px 0,
	#FFF 0px 1px 0, #FFF  0-1px 0,
	#FFF -1px 0 0, #FFF 1px 0 0;
}
#wrapper .LiveBnr a .deadline i {
	font-size: 1.2em;
}

/*	 Button
-----------------------------------*/
#wrapper .LiveBnr a .btn {
	display:inline-block;
	position: relative;
	width: auto;
	min-width: 90px;
	margin-left: 30px;
	padding: 0px 20px 0px 5px;
	font-size: 12px;
	color: #FFF;
	text-align: center;
	line-height: 2em;
	background:#00489c;
}
#wrapper .LiveBnr a .btn:before {
	display:block;
	position: absolute;
	top: 2px;
	bottom: 0;
	left: -20px;
	margin: auto;
	content: "";
	width: 0;
	height: 0;
	color: #000;
	border-left: 20px solid transparent;
	border-bottom: 25px solid #00489c;
	z-index: 100;
}

#wrapper .LiveBnr a .btn:after {
	display:block;
	position: absolute;
	top: 50%;
	right: 7px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-size: 12px;
	font-weight:normal;
	font-family: "FontAwesome";
	content: "\f105";
}

@media only screen and (max-width: 600px) {
	
/*	 List
-----------------------------------*/
#wrapper .LiveBnr a ul {
	flex-wrap: wrap;
	justify-content:flex-start;
}

}

@media only screen and (max-width: 479px) {
	
#wrapper .LiveBnr {
	background-size: 160%;
}

/*	 tittle
-----------------------------------*/
#wrapper .LiveBnr a .ttl {
	flex-direction: column;
}
#wrapper .LiveBnr a .ttl p {
	padding: 5px;
	font-size: 0.8em;
}
#wrapper .LiveBnr a .ttl p:first-child {
	min-width: auto;
}

#wrapper .LiveBnr a .ttl p:nth-child(2) span {
	font-size: 1.2em;
}

/*	 List
-----------------------------------*/
#wrapper .LiveBnr a ul {
	padding: 10px;
	margin-bottom: 50px;
}

/*	 Deadline / Button
-----------------------------------*/
#wrapper .LiveBnr a .groupe {

}

/*	 Deadline
-----------------------------------*/
#wrapper .LiveBnr a .deadline {
	margin-right: 5px;
}

}

/*--------------------------------------------------------------
	Footer External Banner
---------------------------------------------------------------*/

.FooterExBnr ul {
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-justify-content: center;/* 横方向中央揃え（Safari用） */
	justify-content: center;/* 横方向中央揃え */
	
	width: 100%;
	padding: 30px 0px 0px;
	border-top: 1px solid #ccc;
}
.FooterExBnr ul li {
	display: inline-block;
	margin: 10px;
	padding: 0;
	list-style: none;
}
.FooterExBnr ul li img {
	display: block;
	width: auto;
	max-width: 100%;
}

/*--------------------------------------------------------------
	Article Float Images
---------------------------------------------------------------*/
.FloatLimg {
	float: left;
	margin: 0 20px 20px 0;
}
.FloatRimg {
	float: right;
	margin: 0 0 20px 20px;
}
@media only screen and (max-width: 767px) {
.FloatLimg,
.FloatRimg {
	float: none;
	margin: 30px auto;
	text-align:center;
}
}

/*--------------------------------------------------------------
	2 Column Count List [ facility / sitemap ]
---------------------------------------------------------------*/
#contents .colmun2count {
	display:block;
	column-count: 2;
	column-gap: 0px !important;
	
	width: 100%;
	max-width: 100%;
	margin: 0px auto;
}
#contents .colmun2count nav {
	display: inline-block;
	width: 100%;
	vertical-align: top;
	padding-right: 20px;
	margin-bottom: 30px;
}
#contents .colmun2count nav:after {
	content: "";
	display:block;
	clear:both;
}

/*	sitemap only
-----------------------------------*/
#contents .sitemap nav {
	float: left;
}
#contents .sitemap nav:after {
	content: "";
	display:block;
	clear:both;
}
/*---------------------------------*/

#contents .colmun2count nav h2 {
	margin-top: 0px;
}
#contents .colmun2count nav:nth-last-child(-n+4) {
	padding-left: 20px;
	padding-right: 0px;
}

@media only screen and (max-width: 767px) {
#contents .colmun2count {
	column-count: 1;
}
#contents .colmun2count nav {
	padding-right: 0px;
	margin-bottom: 0px;
}
#contents .colmun2count nav:nth-last-child(-n+4) {
	padding-left: 0px;
}

}


/*--------------------------------------------------------------
	Sitemap
--------------------------------------------------------------*/
#contents .sitemap {
	display: inline-block;
	width: 100%;
	max-width: 100%;
	margin: 0px auto;
}
#contents .sitemap h2 {
	padding: 5px 10px;
	margin-bottom: 0px;
	font-size: 1.1em;
	font-weight: 500;
	border: 1px solid #7ecef4;
	background: #7ecef4;
}
#contents .sitemap > ul {
	margin-bottom: 30px;
}
#contents .sitemap > ul,
#contents .sitemap > ul ul {
    list-style-type: none;
    padding:0;
}
#contents .sitemap > ul ul {
    position: relative;
    margin-left: 10px;
}
#contents .sitemap > ul li {
	padding: 0;
	list-style: none;
}

/*	 Main Page Title
--------------------------------------*/
#contents .sitemap > ul > li:first-child > span  {
	display:block;
	padding: 5px 10px;
	background: rgba(102,153,255,0.3);
}

/*	 Sub Page Title
--------------------------------------*/
#contents .sitemap > ul > li > ul li {
    position:relative;
    margin:0;
    padding: 3px 20px;
    text-decoration: none;
}

/*	 Link
--------------------------------------*/
#contents .sitemap > ul li a { 
    position:relative;
    text-decoration: none;
}

/*	 Decoration [ tree border ]
--------------------------------------*/
#contents .sitemap > ul ul:before {
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    display:block;
    width:0;
    content:"";
    border-left:1px solid #ccc;
}
#contents .sitemap > ul ul li:before {
    position:absolute;
    top: 17px;
    left: 0;
    display:block;
    width: 15px;
    height:0;
    content:"";
    border-top:1px solid #ccc;
}
#contents .sitemap > ul ul li:last-child:before {
    height: auto;
    top: 17px;
    bottom: 0;
    background: #fff;
}

@media screen and (max-width: 767px) {
#contents .sitemap {
    display: block;
}
#contents .sitemap {
	width: 100%;
}

}

/*--------------------------------------------------------------
	Thumnail List
---------------------------------------------------------------*/
#contents .thumList ul {
	display: flex;
	flex-wrap: wrap;
}
#contents .thumList ul li {
	display: flex;
	flex-wrap: wrap;
	width: calc( 100% / 6);
	padding: 0px 10px;
	margin-bottom: 20px;
	list-style: none;
}
#contents .thumList ul li a {
	display: block;
	width: 100%;
}
#contents .thumList ul li a span {
	position: relative;
	display: block;
	width: 100%;
	
	padding-top: 65%;
	overflow: hidden;
	border: 1px solid #ddd;
}
#contents .thumList ul li img {
	display: block;
	width: 100%;
	max-width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);	
}
#contents .thumList ul li p {
	font-size: 0.9em;
}

@media only screen and (max-width: 767px) {
#contents .thumList ul li {
	width: calc( 100% / 4);
}
}

@media only screen and (max-width: 479px) {
#contents .thumList ul li {
	width: calc( 100% / 2);
}
}

/*--------------------------------------------------------------
	Event Grid rayout
---------------------------------------------------------------*/
#contents .event {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	
	padding: 30px 0px;
	border-top: 1px dashed #ddd;
}
#contents .event:first-child {
	padding: 0px 0px 30px;
	border-top: none;
}

#contents .event .ttl {
	order: 2;
	width: 65%;
	margin-bottom: 20px;
	font-weight: 600;
	font-size: 1.2em;
}
#contents .event .img {
	order: 1;
	width: 35%;
	max-height: 50px;
	text-align:center;
}
#contents .event .detail {
	order: 3;
	width: 65%;
}
#contents .event .detail p {
	padding: 0px;
}

#contents .event .img img {
	width: 100%;
	max-width: 80%;
}

@media only screen and (max-width: 767px) {
#contents .event {
	display: block;
}
#contents .event .ttl,
#contents .event .img,
#contents .event .detail {
	width: 100%;
	margin-bottom: 20px;
}
#contents .event .ttl {
	order: 1;
}
#contents .event .img {
	order: 2;
	max-height: none;
}
#contents .event .detail {
	order: 3;
}

}

/*--------------------------------------------------------------
	Movie Grid rayout
---------------------------------------------------------------*/
#contents .movie {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	
	padding: 30px 0px;
	border-top: 1px dashed #ddd;
}
#contents .movie:first-child {
	padding: 0px 0px 30px;
	border-top: none;
}

#contents .movie .txt {
	order: 2;
	width: 65%;
	margin-bottom: 20px;
}
#contents .movie .txt h3 {
	border: none;
	font-weight: 600;
	font-size: 1.2em;
}
#contents .movie .img {
	order: 1;
	width: 35%;
	max-height: 50px;
	text-align:center;
}
#contents .movie .detail {
	order: 3;
	width: 65%;
}
#contents .movie .detail p {
	padding: 0px;
}

#contents .movie .img img {
	width: 100%;
	max-width: 80%;
}

@media only screen and (max-width: 767px) {
#contents .movie {
	display: block;
}
#contents .movie .txt,
#contents .movie .img,
#contents .movie .detail {
	width: 100%;
	margin-bottom: 20px;
}
#contents .movie .txt {
	order: 1;
}
#contents .movie .img {
	order: 2;
	max-height: none;
}
#contents .movie .detail {
	order: 3;
}

}

/*--------------------------------------------------------------
	Movie video table
---------------------------------------------------------------*/

table.video td.v-img a {
	position:relative;
	display:block;
	z-index: 10;
}
table.video td.v-img a:after {
	position: absolute;
	top: 50%;
	left: 50%;
	display: inline-block;
	width: auto;
	height: auto;
	-webkit-transform: translate(-50% ,-50%);
	transform: translate(-50% ,-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 400;
	font-size: 35px;
	color: rgba(255,255,255,0.9);
	content: "\f144";
	z-index:100;
}

#contents table.video td.v-text h4 {
	padding: 10px;
	margin: 0px auto 0px;
}

@media only screen and (max-width: 767px) {
table.video td {
	display:block;
	width: 100%;
}
table.video td.v-img {
	text-align:center;
	background:#111;
}

}

/*--------------------------------------------------------------
	PR Magazine
---------------------------------------------------------------*/

#contents .magazine {
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 1px dashed #66CCFF;
}
#contents .magazine:last-child {
	border-bottom: none;
}

/*	 Tittle
-----------------------------------*/
#contents .magazine h3 {
	border: none;
	padding: 0px;
	margin: 0px;
}
#contents .magazine h3 small {
	display:block;
	font-weight: 400;
}

/*	 Images
-----------------------------------*/
#contents .magazine .img {
	text-align:center;
}

/*	 Button
-----------------------------------*/
#contents .magazine .btn .book,
#contents .magazine .btn .pdf {
	display:block;
	max-width: 200px;
	padding: 0px;
	margin: 0px auto 20px;
}
.magazine .btn .book a,
.magazine .btn .pdf a {
	position:relative;
	display: block;
	width: 100%;
	padding: 5px 30px 5px 2.25em;
	color: #FFF;
	font-size: 0.85em;
	background: #1871c7;
}
.magazine .btn .book a {
	background: #1871c7;
}
.magazine .btn .pdf a {
	background: #F63;
}
.magazine .btn .book a:before,
.magazine .btn .pdf a:before {
	position: absolute;
	top: 50%;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 1em;
}
.magazine .btn .book a:before {
	left: 10px;
	content: "\f518";
}
.magazine .btn .pdf a:before {
	left: 13px;
	content: "\f1c1";
}
.magazine .btn .book a:after,
.magazine .btn .pdf a:after {
	position: absolute;
	top: 50%;
	right: 10px;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f0da";
}

#contents .magazine .btn .book a:hover {
	text-decoration: none;
	background: #064f95;
}
#contents .magazine .btn .pdf a:hover {
	text-decoration: none;
	background: #ff4200;
}


@media only screen and (min-width: 767px) {
#contents .magazine {
	display: grid;
	grid-template-columns: 220px 1.05fr 2fr;
	grid-template-rows: repeat(2, 1fr);

	grid-column-gap: 0px;
	grid-row-gap: 0px;
}

#contents .magazine h3 {    grid-area: 1 / 2 / 2 / 3;}
#contents .magazine .img {  grid-area: 1 / 1 / 3 / 2;}
#contents .magazine .btn {  grid-area: 2 / 2 / 3 / 3;}
#contents .magazine .list { grid-area: 1 / 3 / 3 / 4;}

/*----- IE -----*/
#contents .magazine {
	display: -ms-grid;
	-ms-grid-columns: 220px 1.05fr 2fr;
	-ms-grid-rows: 1fr;
}

#contents .magazine h3 {
	-ms-grid-row: 1;
	-ms-grid-column: 2;
	-ms-grid-row-span: 1;
	-ms-grid-column-span: 1;
}

#contents .magazine .img {
	-ms-grid-row: 1;
	-ms-grid-column: 1;
	-ms-grid-row-span: 2;
	-ms-grid-column-span: 1;
}

#contents .magazine .btn {
	-ms-grid-row: 2;
	-ms-grid-column: 2;
	-ms-grid-row-span: 1;
	-ms-grid-column-span: 1;
}

#contents .magazine .list {
	-ms-grid-row: 1;
	-ms-grid-column: 3;
	-ms-grid-row-span: 2;
	-ms-grid-column-span: 1;
}
/*----- IE -----*/


#contents .magazine .list {
	margin-left: 20px;
	font-size: 0.9em;
}
#contents .magazine .list .list_mark ul li {
	margin-bottom: 5px;
}

}

@media only screen and (max-width: 767px) {
#contents .magazine {
	display: flex;
	flex-direction: column;
	
	margin-bottom: 20px;
	padding-bottom: 20px;
}

/*	 Tittle
-----------------------------------*/
#contents .magazine h3 small {
	display: inline-block;
	padding: 0px 10px;
	margin: 0px 10px 20px 0px;
	color: #FFF;
	background:#6CC;
}

/*	 Images
-----------------------------------*/
#contents .magazine .img {
	display: flex;
	flex-direction: column;
	align-items: center;
}
#contents .magazine .img {
	justify-content: center;
	margin-bottom: 20px;
}

/*	 Button
-----------------------------------*/
.magazine .btn {
	display: flex;
	align-items: center;
}
.magazine .btn .book a,
.magazine .btn .pdf a {
	padding: 10px 30px 10px 2.25em;
}
}
@media only screen and (max-width: 350px) {
/*	 Button
-----------------------------------*/
.magazine .btn {
	width: 100%;
	flex-direction: column;
}
.magazine .btn .book a,
.magazine .btn .pdf a {
	min-width: 180px;
}
}

/*--------------------------------------------------------------
	Floor Table
---------------------------------------------------------------*/

.floorTable dl {
	display: flex;
	flex-wrap: wrap;
	border: 1px solid #ccc;
}
.floorTable dl dt,
.floorTable dl dd {
	padding: 15px;
	border-top: 1px solid #ccc;
}
.floorTable dl dt:first-of-type,
.floorTable dl dd:first-of-type {
	border-top: none;
}
.floorTable dl dt {
	width: 20%;
	text-align:center;
	color: #0066cc;
	font-size: 2em;
	font-weight:bold;
	background: #eafafb;
}
.floorTable dl dd {
	width: 80%;
	border-left: 1px solid #ccc;
}

@media only screen and (max-width: 479px) {
.floorTable dl dt {
	font-size: 1.2em;
}
}

/*--------------------------------------------------------------
	Departments
---------------------------------------------------------------*/
.mokuji {
	margin-bottom: 30px;
}
.mokuji ul {
	display: flex;
	flex-wrap: wrap;
}
.mokuji ul li {
	margin-right: 20px;
	padding: 0;
	list-style: none;
}
.mokuji ul li a {
	position:relative;
	padding-left: 1.8em;
}
.mokuji ul li a:before {
	position: absolute;
	top: 50%;
	left: 10px;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 400;
	color: #000;
	content: "\f150";
}

@media only screen and (max-width: 479px) {
.mokuji ul li {
	margin-bottom: 15px;
}
}

/*	 Floor Contact
-----------------------------------*/
.floorContact {
}


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

	Right Column
	
===============================================================*/
	
/*--------------------------------------------------------------
	Category Side Menu
---------------------------------------------------------------*/

#right-column .SideMenu {
	display: block;
	width: 100%;
	margin: 0px auto 30px;
	border: 1px solid #ccc;
}
#right-column .SideMenu > h3 {
	display:block;
	margin: 0px;
	padding: 5px;
	font-size: 1em;
	font-weight: 500;
	text-align:center;
	color: #3fb5ff;
	border: none;
	border-top: 5px solid #3fb5ff;
	border-bottom: 1px solid #ccc;
}

#right-column .SideMenu ul {
	display: flex;
	flex-direction: column;
	width: 100%;
}

#right-column .SideMenu ul li {
	display: flex;
	width: 100%;
	list-style: none;
	font-size: 0.9em;
	border-top: 1px solid #ccc;
}

#right-column .SideMenu ul:first-of-type li:first-of-type {
	border-top: none;
}

#right-column .SideMenu ul li:first-of-type {
	border-top: 1px solid #ccc;
}

#right-column .SideMenu ul li a small {
	display: inline-block;
	color: #999;
}

#right-column .SideMenu ul li a {
	position:relative;
	display:block;
	width: 100%;
	height: 100%;
	padding: 10px 10px 10px 25px;
}

#right-column .SideMenu ul li a:before {
	position: absolute;
	top: 10px;
	left: 10px;
	display: inline-block;
	width: auto;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #333;
	
	content: "\f0da";
}

@media only screen and (max-width: 979px) {
#right-column .SideMenu {
	max-width: 95%;
	border: none;
}
#right-column .SideMenu > h3 {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

#right-column .SideMenu ul {
	flex-direction: row;
	flex-wrap: wrap;
}
#right-column .SideMenu ul li {
	width: calc( 100% / 3 );
	
	border-top: none;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

}

@media only screen and (min-width: 479px) and (max-width: 979px) {
#right-column .SideMenu ul li:nth-child(3n+1) {
	border-left: 1px solid #ccc;
}
}

@media only screen and (max-width: 479px) {
#right-column .SideMenu ul li {
	width: calc( 100% / 2 );
}
#right-column .SideMenu ul li:nth-child(2n+1) {
	border-left: 1px solid #ccc;
}
}

/*--------------------------------------------------------------
	Right Column Banner Link
---------------------------------------------------------------*/
#contents .ad,
#contents .ad-ex {
	width:100%;
	margin: 0px auto;
}
#contents .ad ul,
#contents .ad-ex ul {
	display: flex;
	flex-direction: column;
	width:100%;
	margin: 0px auto;
}
#contents .ad li,
#contents .ad-ex li {
	position:relative;
	padding: 0px;
	margin-bottom: 20px;
	list-style: none;
	font-size: 90%;
	text-align:center;
}

/*	 Image
---------------------------------------------------------------*/
#contents .ad li img,
#contents .ad-ex li img {
	width: auto;
}

/*	 Link
---------------------------------------------------------------*/
#contents .ad li a,
#contents .ad-ex li a {
	color:#06F;
	text-decoration: underline;
}
#contents .ad li a:hover,
#contents .ad-ex li a:hover {
	color: #0CF;
	text-decoration: underline;
}

/*	 Text
---------------------------------------------------------------*/
#contents .ad p,
#contents .ad-ex p {
	display:inline;
	margin-top: 5px;
}
#contents .ad li a p:after,
#contents .ad-ex li a p:after {
	display: inline-block;
	position:relative;
	top: 1px;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 85%;
	color: #333;
}
#contents .ad li a p:after {
	content: "\f0da";
}
#contents .ad-ex li a p:after {
	content: "\f35d";
}

@media only screen and (max-width: 979px) {
#contents .ad ul,
#contents .ad-ex ul {
	flex-wrap: wrap;
	justify-content: center;
	flex-direction: row;

}
#contents .ad li,
#contents .ad-ex li {
	display: inline-block;

	padding: 0;
	margin: 6px 6px 20px 6px;
	vertical-align: top;
}

/*	 Image
---------------------------------------------------------------*/
#contents .ad img,
#contents .ad-ex img {
	margin: 0 auto;
}

}

@media only screen and (max-width: 767px) {
#contents .ad-ex ul {
	display:block;
	margin:0 auto;
}
#contents .ad-ex li {
	display: block;
	width: auto;
	margin-bottom: 7px;
	text-align: left;
}
#contents .ad-ex li {
	padding-left: 15px;
}

/*	 Image
---------------------------------------------------------------*/
#contents .ad-ex img {
	display:none;
}

/*	 Icon
---------------------------------------------------------------*/
#contents .ad-ex li:before {
	position: absolute;
	top: 10px;
	left: 0px;
	display: inline-block;
	width: 0px;
	height: 100%;
	vertical-align: top;
	font-size: 12px;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f0da";
}

/*	 Text
---------------------------------------------------------------*/
#contents .ad-ex li p {
	display: inline-block;
	width: 90%;
	vertical-align:middle;
}

}

@media only screen and (max-width: 479px) {
	
#contents .ad ul {
	justify-content: space-between;
}
	
#contents .ad li {
	width: 45%;
	margin: 0px 6px 20px;
}

}
/*--------------------------------------------------------------
	Side Box  [ Mayor / Population ]
---------------------------------------------------------------*/
#contents .mayor,
#contents .population {
	margin-bottom: 30px;
	border: 1px solid #81d8ff;
	
}
#contents .mayor h3,
#contents .population h3 {
	margin: 0px;
	padding: 5px;
	font-size: 1em;
	font-weight: 500;
	color: #FFF;
	text-align:center;
	border-left: none;
	border-bottom: 1px solid #81d8ff;
	background: #009afe;
	background: -moz-linear-gradient(top,  #009afe 0%, #00ccfe 100%);
	background: -webkit-linear-gradient(top,  #009afe 0%,#00ccfe 100%);
	background: linear-gradient(to bottom,  #009afe 0%,#00ccfe 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009afe', endColorstr='#00ccfe',GradientType=0 );
}

/*	 Box
---------------------------------------------------------------*/
#contents .mayor .box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px;
}
#contents .mayor .box .txt {
	width: 60%;
	padding: 0px 0px 0px 10px;
}
#contents .mayor .box .txt p {
	font-size: 0.9em;
	padding: 0px;
}
#contents .mayor .box .img {
	width: 40%;
}
#contents .mayor .box .img img {
	width: 100%;
}

#contents .population .box {
	display: block;
	padding: 10px;
}
#contents .population .box p {
	margin-bottom: 10px;
}

@media only screen and (max-width: 767px) {

#contents .mayor .box .txt p {
	margin-bottom: 15px;
	font-size: 1em;
}

}


/*--------------------------------------------------------------
	Digital Book
---------------------------------------------------------------*/
#contents .DigitalBook {
	display:block;
	width: 100%;
	max-width: 290px;
	padding: 0px;
	margin: 0px auto 30px;
	border: 1px solid #ccc;
}

#contents .DigitalBook h3 {
	display:block;
	width: 100%;
	margin: 0px auto 20px;
	padding: 5px;
	text-align:center;
	border-left: none;
	border-bottom: 1px solid #ccc;
}

#contents .DigitalBook .img {
	display:block;
	width: 100%;
	max-width: 90%;
	margin: 10px auto 20px;
	text-align:center;
}

#contents .DigitalBook .btnBook,
#contents .DigitalBook .btnIchiran {
	display:block;
	width: 100%;
	max-width: 80%;
	margin: 0px auto 10px;
	text-align:center;
}
#contents .DigitalBook .btnBook a,
#contents .DigitalBook .btnIchiran a {
	position:relative;
	display:block;
	width: 100%;
	margin: 0px auto;
	padding: 5px 30px 5px 10px;
	color: #FFF;
	font-size: calc( 1em - 3px );

	text-decoration: none;
	border-radius: 5px;
}
#contents .DigitalBook .btnBook a {
	background:#06C
}
#contents .DigitalBook .btnIchiran a {
	background: #1d8383;
}
#contents .DigitalBook .btnBook a:hover {
	background: #03F
}
#contents .DigitalBook .btnIchiran a:hover {
	background: #099
}

#contents .DigitalBook .btnBook a:after,
#contents .DigitalBook .btnIchiran a:after {
	position: absolute;
	top: 50%;
	right: 20px;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	
	display: inline-block;
	width: 0;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f0da";
}

@media only screen and (max-width: 479px) {
#contents .DigitalBook {
	max-width: 100%;
	padding: 10px;
	border: none;
}
#contents .DigitalBook .btnBook,
#contents .DigitalBook .btnIchiran {
	display:block;
	width: 100%;
	max-width: 90%;
	margin: 0px auto 10px;
	text-align:center;
}
	
#contents .DigitalBook .btnBook {
	margin-bottom: 20px;
}

#contents .DigitalBook .btnBook a,
#contents .DigitalBook .btnIchiran a {
	padding: 10px 30px 10px 10px;
	font-size: calc( 1em );
}

}

/*--------------------------------------------------------------
	Life Menu Icon
---------------------------------------------------------------*/

#contents .LifeIcon {
	display:block;
	width: 100%;

	margin: 0px auto 30px;
	border: 1px solid #ccc;
}

#contents .LifeIcon h3 {
	display:block;
	margin: 0px auto;
	padding: 5px;
	font-size: 1em;
	font-weight: 500;
	text-align:center;
	color: #3fb5ff;
	border: none;
	border-top: 5px solid #3fb5ff;
	border-bottom: 1px solid #ccc;
}
	#contents .fList h3 {
		padding: 7px;
		color: #000;
		border-top: none;
	}

/*	List icon
-----------------------------------*/
#contents .LifeIcon ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 15px 10px;
}
#contents .LifeIcon ul li {
	display:block;
	width: calc( 100% / 3.5);
	margin-top: 20px;
	padding: 0;
	list-style: none;
}
	#contents .fList ul li {
		width: calc( 100% / 9.9 );
		margin-top: 0px;
	}
	
#contents .LifeIcon ul li:nth-child(-n+3) {
	margin-top: 0px;
}
#contents .LifeIcon ul li a {
	display:block;
	text-align:center;
}
#contents .LifeIcon ul li a i {
	display: inline-block;
	width: 50px;
	height: 50px;
	
	border: 1px solid #9accfd;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: contain;
	background-color: #99cdff;
}
#contents .LifeIcon ul li a p {
	display:block;
	font-size: 0.9em;
	line-height: 1.2;
	text-align: center;
}

#contents .LifeIcon ul li a i.birth {
	background-image: url(../img/icon/birth.png);
}
#contents .LifeIcon ul li a i.childcare {
	background-image: url(../img/icon/childcare.png);
}
#contents .LifeIcon ul li a i.admission {
	background-image: url(../img/icon/admission.png);
}
#contents .LifeIcon ul li a i.adult {
	background-image: url(../img/icon/adult.png);
}
#contents .LifeIcon ul li a i.employ {
	background-image: url(../img/icon/employ.png);
}
#contents .LifeIcon ul li a i.marriage {
	background-image: url(../img/icon/marriage.png);
}
#contents .LifeIcon ul li a i.moving {
	background-image: url(../img/icon/moving.png);
}
#contents .LifeIcon ul li a i.nursing {
	background-image: url(../img/icon/nursing.png);
}
#contents .LifeIcon ul li a i.death {
	background-image: url(../img/icon/death.png);
}

@media only screen and (max-width: 979px) {
#contents .LifeIcon {
	max-width: 95%;
}
	#contents .fList {
		max-width: 100%;
	}


}

@media only screen and (max-width: 600px) {
	#contents .fList ul li {
		width: calc( 100% / 3.5 );
		margin-top: 20px;
	}

}

/*--------------------------------------------------------------
	Side Box
---------------------------------------------------------------*/

#contents .sideBox {
	display:block;
	width: 100%;
	max-width: 200px;
	margin: 0px auto;
}

#contents .sideBox > ul > li {
	margin-bottom: 30px;
	padding: 0;
	list-style: none;
	border: 1px solid #ccc;
}

#contents .sideBox > ul > li h3 {
	padding: 5px;
	font-size: 1em;
	font-weight: 500;
	text-align:center;
	color: #3fb5ff;
	border: none;
	border-top: 5px solid #3fb5ff;
	border-bottom: 1px solid #ccc;
}

/*	 Box Link
---------------------------------------------------------------*/

#contents .sideBox > ul > li a {
	position:relative;
    display: flex;
    flex-wrap: wrap;
	
	color: #000;
	text-decoration: none;
}

/*	 Box Link Image
--------------------------------*/
#contents .sideBox > ul > li a .img {
	position:absolute;
	top: 0;
	right: 0;
	width: 50%;
	height: 100%;
	background-position: 100% 0%;
	background-repeat: no-repeat;
	background-size: 100% auto;
}
#contents .sideBox > ul > li a .img:before {
	content: "";
	position:absolute;
	top: 0;
	left: 0;
	
	width: 50%;
	height: 100%;
	
	background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
	background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFF', endColorstr='#00ffffff',GradientType=1 );
	z-index: 10;
}

/*	 Box Link Text
--------------------------------*/
#contents .sideBox > ul > li a p {
	position:relative;
	width: 100%;
	padding: 0px 25% 0px 1.25em;
	margin: 10px 5px;
	font-size: 0.9em;
	
	text-shadow: 
	#FFF 1px 1px 0, #FFF -1px -1px 0,
	#FFF -1px 1px 0, #FFF 1px -1px 0,
	#FFF 0px 1px 0, #FFF  0-1px 0,
	#FFF -1px 0 0, #FFF 1px 0 0;
	
	z-index: 100;
}
#contents .sideBox > ul > li a p:before {
	position: absolute;
	top: 0;
	left: 5px;
	display: inline-block;
	width: auto;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #333;
	
	content: "\f0da";
}
#contents .sideBox > ul > li a p > small {
	display:block;
}


@media only screen and (max-width: 979px) {
#contents .sideBox {
	max-width: 95%;
}

#contents .sideBox > ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

	max-width: 100%;
	
}
#contents .sideBox > ul > li {
	display: flex;
	flex-wrap: wrap;
	align-content: stretch;
	align-items: stretch;

	width: calc( 100% / 3.2 );
	padding: 0;
	list-style: none;
	overflow:hidden;
}

#contents .sideBox > ul > li h3 {
	display:block;

	width: 100%;
	margin: 0 auto 0;
}

/*	 Box Link
---------------------------------------------------------------*/

#contents .sideBox > ul > li a {
	display: flex;
	width: 100%;
	height: 100%;
	min-height: 80px;
	align-content: stretch;
	align-items: stretch;
}

/*	 Box Link Text
--------------------------------*/
#contents .sideBox > ul > li a p {
	font-size: 1em;
}

#contents .sideBox > ul > li a p > small {
	display: inline-block;
	margin-right: 10px;
}

}

@media only screen and (max-width: 767px) {
	
#contents .sideBox > ul > li {
	width: calc( 100% /2.1 );
}

/*	 Box Link
---------------------------------------------------------------*/
#contents .sideBox > ul > li a {
	background-size: auto 80px;
}
#contents .sideBox > ul > li a br {
	display: none;
}

}


@media only screen and (max-width: 600px) {
	
#contents .sideBox > ul > li {
	width: calc( 100% );
}

/*	 Box Link Image
--------------------------------*/
#contents .sideBox > ul > li a .img {
	width: 40%;
	background-size: auto 80px;
}
#contents .sideBox > ul > li a .img:before {
	width: 40%;
}

/*	 Box Link Text
--------------------------------*/
#contents .sideBox > ul > li a p {
	padding: 0px 10px 0px 1.25em;
}
}

/*--------------------------------------------------------------
	 Book List
---------------------------------------------------------------*/
.booklist {
	display: block;
	margin: 0px auto;
}

.booklist ul {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}
.booklist ul li {
	width: calc(100% / 3);
	margin-bottom: 40px;
	padding: 0px;
	list-style: none;
	text-align:center;
}
.booklist ul li a {
	display:block;
	line-height: 2.5;
}
.booklist ul li a + a {
	display: inline-block;
	margin-left: 2em;
}
	.booklist ul li a span.ttl {
		display: inline-block;
		color: #111;
		font-weight:bold;
		text-decoration: none;
		
	}
	.booklist ul li a img {
		display: block;
		margin: 0px auto;
		text-align:center;
	}
	
@media only screen and (max-width: 767px) {
.booklist ul li {
	width: calc(100% / 2);
}
}
	
@media only screen and (max-width: 479px) {
.booklist ul li {
	width: calc(100%);
}
}

/*--------------------------------------------------------------
	Right column Slide Banner [ Yoko / Tate ]
---------------------------------------------------------------*/
.swiper-container * {
	  box-sizing:border-box;
} 
#slider,
#slider2 {
	position: relative;
	width: 100%;
	/*height: 100%;*/
	height: auto;
	margin: 0 auto;
	overflow: visible;
}

#slider .swiper-slide,
#slider2 .swiper-slide {
	display:block;
	width: auto;
	text-align:center;

}

@media only screen and (min-width: 979px) {
#slider .swiper-wrapper{
	display:block;
	width: 100%;
}
#slider .swiper-slide{
	width: auto;
	max-width: 100%;
	padding: 0px;
	margin-bottom: 20px;
}

#slider2 .swiper-wrapper{
	flex-wrap:wrap;
	align-items: flex-start;
}
#slider2 .swiper-slide{
	width: calc( 100% / 5);
	max-width: 100%;
	padding: 0px;
}
	
	#slider .swiper-button-prev,
	#slider .swiper-button-next,
	#slider .swiper-pagination,
	#slider2 .swiper-button-prev,
	#slider2 .swiper-button-next,
	#slider2 .swiper-pagination{
		display: none;
	}
}

/*	 Image
---------------------------------------------------------------*/
#slider .swiper-slide img,
#slider2 .swiper-slide img {
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 0px auto 10px;
}

/*	 Slide Arrow Button
---------------------------------------------------------------*/
#slider .swiper-button-prev,
#slider .swiper-button-next,
#slider2 .swiper-button-prev,
#slider2 .swiper-button-next {
	top: 69%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	height: 100%;
	
	padding: 0px 20px;
	background: rgba(0,0,0,0.5);
}

#slider .swiper-button-prev,
#slider2 .swiper-button-prev {
  left: 0px;
}
#slider .swiper-button-next,
#slider2 .swiper-button-next {
  right: 0px;
}

#slider .swiper-button-prev:after,
#slider .swiper-container-rtl .swiper-button-next:after,
#slider .swiper-button-next:after,
#slider .swiper-container-rtl .swiper-button-prev:after,
#slider2 .swiper-button-prev:after,
#slider2 .swiper-container-rtl .swiper-button-next:after,
#slider2 .swiper-button-next:after,
#slider2 .swiper-container-rtl .swiper-button-prev:after {
	color: #FFF;
	font-size: 20px;
}
#slider .swiper-button-prev:after,
#slider .swiper-container-rtl .swiper-button-next:after,
#slider2 .swiper-button-prev:after,
#slider2 .swiper-container-rtl .swiper-button-next:after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f053";
}

#slider .swiper-button-next:after,
#slider .swiper-container-rtl .swiper-button-prev:after,
#slider2 .swiper-button-next:after,
#slider2 .swiper-container-rtl .swiper-button-prev:after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f054";
}

/*	 Pagenaton icon
---------------------------------------------------------------*/
#slider .swiper-pagination-fraction,
#slider .swiper-pagination-custom,
#slider .swiper-container-horizontal > .swiper-pagination-bullets,
#slider2 .swiper-pagination-fraction,
#slider2 .swiper-pagination-custom,
#slider2 .swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: -20px;
}

#slider .swiper-pagination-bullet,
#slider2 .swiper-pagination-bullet {
  width: 4px;
  height: 4px;
}

@media only screen and (max-width: 979px) {
#slider,
#slider2 {
	width: 100%;
	max-width: 100%;
	padding: 20px 0px 30px;
	background: #f2e9e9;
}

}
@media only screen and (max-width: 479px) {
#slider .swiper-slide,
#slider2 .swiper-slide{
	width: auto;
	max-width: 100%;
}

}


/*--------------------------------------------------------------
	Life Menu
---------------------------------------------------------------*/
#contents .LifeMenu {
	display:block;
	margin: 0px auto;
	border: 1px solid #81d8ff;
}
#contents .LifeMenu h2 {
	display:block;
	padding: 10px 20px;
	margin: 0px;
	border: none;
	border-bottom: 1px solid #81d8ff;
	background: #acddfe;
	background: -moz-linear-gradient(top,  #acddfe 0%, #f5fafe 100%);
	background: -webkit-linear-gradient(top,  #acddfe 0%,#f5fafe 100%);
	background: linear-gradient(to bottom,  #acddfe 0%,#f5fafe 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#acddfe', endColorstr='#f5fafe',GradientType=0 );
}
#contents .LifeMenu nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 20px;
}
#contents .LifeMenu dl {
	width: calc( 100% / 3.5 );
	margin-bottom: 20px;
}
#contents .LifeMenu dl dt {
	margin-bottom: 10px;
}
#contents .LifeMenu dl dt a {
	position:relative;
	padding-left: 1em;
}
#contents .LifeMenu dl dt a i {
	display: none;
}
#contents .LifeMenu dl dt a:before {
	position: absolute;
	top: 50%;
	left: 3px;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #333;
	content: "\f0da";
}


@media only screen and (max-width: 979px) {
#contents .LifeMenu {
	max-width: 95%;
}
	
}

@media only screen and (max-width: 767px) {
#contents .LifeMenu dl {
	width: calc( 100% / 2.2 );
}

#contents .LifeMenu dl dt a i {
	display:inline-block;
	margin-left: 10px;
	padding: 0px 10px;
	color: #FFF;
	font-size: 0.9em;
	border-radius: 30px;
	background:#22ac38;
}
	
}


@media only screen and (max-width: 479px) {
#contents .LifeMenu dl {
	width: calc( 100% / 1 );
}
	
}

/*--------------------------------------------------------------
	Plan Index [ kadena ]
---------------------------------------------------------------*/
#contents .PlanIndex h3 {
	padding: 5px 10px;
	margin: 0px auto 30px;
	border-left: none;
}


/*	 Index 1
---------------------------------------------------------------*/
#contents .PlanIndex .joron h3 {
	color: #d3a000;
	background-color: #ffefc1;
}
#contents .PlanIndex .kihon h3 {
	color: #00833e;
	background-color: #d3e9d0;
}
#contents .PlanIndex .zenki h3 {
	color: #00a7ea;
	background-color: #d8effc;
}
#contents .PlanIndex .sankou h3 {
	color: #fff;
	background-color: #1d50a2;
}


#contents .PlanIndex .PDF {
	text-align:right;
}
#contents .PlanIndex .index > ul > li {
	margin-top: 30px;
}

#contents .PlanIndex .index ul li,
#contents .PlanIndex .index ol li {
	list-style: none;
}

/*------ h4 -----*/
#contents .PlanIndex .index > ul > li > h4 {
	display: flex;
	align-items: center;
	justify-content:space-between;
}
#contents .PlanIndex .index > ul > li > h4 .txt {
	display: block;
	width: auto;
	min-width: 55%;
	padding: 5px 20px;
	font-size: 0.8em;
	border-radius: 30px;
}
#contents .PlanIndex .joron > ul > li > h4 .txt {
	color: #d3a000;
	background-color: #ffefc1;
}
#contents .PlanIndex .kihon > ul > li > h4 .txt {
	color: #00833e;
	background-color: #d3e9d0;
}
#contents .PlanIndex .zenki > ul > li > h4 .txt {
	color: #00a7ea;
	background-color: #d8effc;
}

#contents .PlanIndex .index > ul > li > h4 i {
	display: inline-block;
	width: 37%;
	height: 1px;
	margin-left: auto;
	border-bottom: 1px dashed #000;
}
#contents .PlanIndex .index > ul > li > h4 .page {
	width: 5%;
	text-align:right;
}

/*------ Number List -----*/
#contents .PlanIndex .index > ul > li > ol {
	display:block;
	width: 100%;
	max-width: 80%;
}
#contents .PlanIndex .sankou > ul > li > ol {
	max-width: 95%;
}
#contents .PlanIndex .index > ul > li > ol > li {
	list-style:decimal;
	margin-left: 1em;
	margin-bottom: 10px;
}
#contents .PlanIndex .sankou > ul > li > ol > li {
	margin-left: 0em;
}
#contents .PlanIndex .index > ul > li > ol > li > div {
	display: flex;
	align-items: center;
	justify-content:space-between;
}
#contents .PlanIndex .index > ul > li > ol > li .txt {
	display: block;
	width: auto;
}
#contents .PlanIndex .index > ul > li > ol > li i {
	display: inline-block;
	width: 50%;
	height: 1px;
	margin-left: auto;
	border-bottom: 1px dashed #000;
}
#contents .PlanIndex .index > ul > li > ol > li .page {
	width: 5%;
	text-align:right;
}


@media only screen and (max-width: 479px) {

/*	 Index 1
---------------------------------------------------------------*/
/*------ h4 -----*/
#contents .PlanIndex .index > ul > li > h4 {
	padding: 0px;
}
#contents .PlanIndex .index > ul > li > h4 .txt {
	min-width: 80%;
	margin-right: 10px;
}
#contents .PlanIndex .index > ul > li > h4 i {
	width: 20px;
}
#contents .PlanIndex .index > ul > li > h4 .page {
	width: 30px;
}

/*------ Number List -----*/
#contents .PlanIndex .index > ul > li > ol {
	display:block;
	width: 100%;
	max-width: 100%;
	padding-left: 1.5em;
}
#contents .PlanIndex .index > ul > li > ol > li {
	margin-left: 0em;
}
#contents .PlanIndex .index > ul > li > ol > li .txt {
	margin-right: 1em;
}

#contents .PlanIndex .index > ul > li > ol > li i {
	width: 20px;
}
#contents .PlanIndex .index > ul > li > ol > li .page {
	width: 30px;
}
#contents .PlanIndex .sankou > ul > li > ol > li .page {
	width: 40px;
}

}

/*	 Index 2
---------------------------------------------------------------*/
#contents .PlanIndex .index2 {
	display:block;
	width: 100%;
	max-width: 90%;
	margin-left:auto;
	margin-right:auto;
}
#contents .PlanIndex .index2 h3 {
	position:relative;
	padding-left: 130px;
	margin: 0px;
}
#contents .PlanIndex .index2 h3 br,
#contents .PlanIndex .index2 > ul > li .txt > small + br {
	display: none;
}

#contents .PlanIndex .index2 h3 > span,
#contents .PlanIndex .index2 > ul > li .txt > small {
	position:absolute;
	top: 5px;
	left:0;
	display:inline-block;
	padding: 0px 10px;
	margin-right: 10px;
	color: #fff;
}
#contents .PlanIndex .pink h3 > span,
#contents .PlanIndex .pink > ul > li .txt > small {
	background-color: #ec6d74;
}
#contents .PlanIndex .yellow h3 > span,
#contents .PlanIndex .yellow > ul > li .txt > small {
	background-color: #fed505;
}
#contents .PlanIndex .blue h3 > span,
#contents .PlanIndex .blue > ul > li .txt > small {
	background-color: #1d50a2;
}
#contents .PlanIndex .orange h3 > span,
#contents .PlanIndex .orange > ul > li .txt > small {
	background-color: #ed6c00;
}
#contents .PlanIndex .purple h3 > span,
#contents .PlanIndex .purple > ul > li .txt > small {
	background-color: #c265a4;
}


/*------ List -----*/
#contents .PlanIndex .index2 > ul {
	display:block;
	width: 100%;
	max-width: 90%;
	margin: 30px 0px;
}
#contents .PlanIndex .index2 > ul > li {
	list-style: none;
	margin-left: 1em;
	margin-bottom: 10px;
}
#contents .PlanIndex .index2 > ul > li > div {
	display: flex;
	align-items: center;
	justify-content:space-between;
}
#contents .PlanIndex .index2 > ul > li .txt {
	position:relative;
	display: block;
	width: auto;
	min-width: 65%;
	padding-left: 120px;
}
#contents .PlanIndex .index2 > ul > li i {
	display: inline-block;
	width: 25%;
	height: 1px;
	margin-left: auto;
	border-bottom: 1px dashed #000;
}
#contents .PlanIndex .index2 > ul > li .page {
	width: 5%;
	text-align:right;
}

@media only screen and (max-width: 479px) {
/*	 Index 2
---------------------------------------------------------------*/
#contents .PlanIndex .index2 {
	max-width: 100%;
}
#contents .PlanIndex .index2 h3 {
	position:relative;
	padding-left: 0px;
	margin: 0px;
}
#contents .PlanIndex .index2 h3 br,
#contents .PlanIndex .index2 > ul > li .txt > small + br {
	display:block;
}
#contents .PlanIndex .index2 h3 > span,
#contents .PlanIndex .index2 > ul > li .txt > small {
	position: relative;
	top: auto;
	display: inline-block;
}

/*------ List -----*/
#contents .PlanIndex .index2 > ul {
	max-width: 100%;
}
#contents .PlanIndex .index2 > ul > li {
	margin-left: 0em;
}

#contents .PlanIndex .index2 > ul > li .txt {
	position:relative;
	display: block;
	width: auto;
	min-width: auto;
	padding-left: 0px;
}
#contents .PlanIndex .index2 > ul > li i {
	display: inline-block;
	width: 20px;
}
#contents .PlanIndex .index2 > ul > li .page {
	width: 40px;
}
}




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

	Footer
	
===============================================================*/
footer {
	display:block;
	width: 100%;
	background: #d4f9ff;
}
#footer-inner {
	width: 100%;
	max-width: 960px;
	margin: 0px auto 30px;
	padding: 20px 0px;
}

/*	 footer sitemap
---------------------------------------------------------------*/
footer .footerNav {
    display: flex;
    justify-content: space-between;
	width: 100%;
}

footer .footerNav nav h4 {
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom: 1px solid #a8d1d8;
}
footer .footerNav nav {
	width: calc( 100% / 5.7 );
}
footer .footerNav nav ul li a {
	position:relative;
	display: inline-block;
	font-size: 0.9em;
}
footer .footerNav nav ul li a p {
	position:relative;
	padding-left: 1em;
}
footer .footerNav nav ul li a p:before {
	position: absolute;
	top: 0px;
	left: 3px;
	display: inline-block;
	width: auto;


	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f0da";
	font-style:normal;
	color: #000;
}

/*	 address
---------------------------------------------------------------*/

footer #footer-inner .address {
	display:block;
	width: 100%;
	max-width: 100%;
	margin: 10px auto 30px;
	padding: 10px 0px 0px;
	border-top: 1px solid #666;
}

footer #footer-inner .address h2 {
	display:block;
	padding: 0px;
	margin: 0px;
	font-size: 110%;
	font-weight:bold;
	border: none;
	background: none;
}

footer #footer-inner .address address {
	margin-bottom: 20px;
}
footer #footer-inner .address .tel-link,
footer #footer-inner .address .btn {
	display:inline-block;
	margin-right: 20px;
	margin-bottom: 20px;
}
footer #footer-inner .address .btn a {
	position:relative;
	display: inline-block;
	padding: 5px 10px 5px 20px;
	border: 1px solid #000;
	background:#FFF;
}
footer #footer-inner .address .btn a:before {
	position: absolute;
	top: 50%;
	left: 10px;
	display: inline-block;
	width: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #333;
	
	content: "\f0da";
}

@media only screen and (min-width: 767px) {
footer #footer-inner .address {
	display: none;

}
}


/*	 Copyright
---------------------------------------------------------------*/
.copyright {
	display:block;
	text-align: center;
	color: #FFF;
	font-size: 70%;
	margin-top: 0px;
	padding: 7px 0px;
	background: #009dff;
}

@media only screen and (max-width: 979px) {
#footer-inner {
	max-width: 95%;
	padding: 20px 0px 0px;
}

}

@media only screen and (max-width: 767px) {
	
/*	 sitemap
---------------------------------------------------------------*/
footer .footerNav {
	flex-wrap: wrap;
}

footer .footerNav nav {
	width: calc( 100% / 2.1 );
	margin-bottom: 30px;
}

}

@media only screen and (max-width: 600px) {
#footer-inner {
	max-width: 100%;
	padding: 0px;
}
/*	 sitemap
---------------------------------------------------------------*/
footer .footerNav nav {
	width: calc( 100% );
	margin-bottom: 0px;
}

footer .footerNav nav h4 {
	padding: 5px;
	margin-bottom: 0px;
	text-align:center;
	border-bottom: none;
	background:#bfe5f8;
}

footer .footerNav nav ul {
	display: flex;
	flex-wrap: wrap;
}
footer .footerNav nav ul li {
	display: flex;
	width: 50%;
	
	border-left: 1px solid #bfe5f8;
	border-bottom: 1px solid #bfe5f8;
}
footer .footerNav nav ul li:nth-child(2n+1) {
	border-left: none;
}
footer .footerNav nav ul li a {
	display: flex;
	width: 100%;
	padding: 10px;
	background:#FFF;
}

footer .footerNav nav ul li a p {
	position:relative;
	display:block;
	width: 100%;
	padding-left: 0;
	padding-right: 2em;
}
footer .footerNav nav ul li a p:before {
	position: absolute;
	top: 50%;
	left: auto;
	right: 0px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

/*	 address
---------------------------------------------------------------*/
footer #footer-inner .address {
	max-width: 95%;
	border-top: none;
}

}

@media only screen and (max-width: 530px) {
footer #footer-inner .address address {
	margin-bottom: 10px;
}
	
footer #footer-inner .address .tel {
	display: block;
}

footer #footer-inner .address .btn {
	margin-bottom: 0px;
	font-size: 0.85em;
}
}

/*--------------------------------------------------------------
	Page TOP
---------------------------------------------------------------*/

#pagetop {
	right: 5%;
}
@media only screen and (max-width: 979px) {
#pagetop {
	right: 10px;
}
}

.pagetop {
	position: fixed;
	bottom: 10px;

	height: 0;
	opacity: 0;
	overflow: hidden;
	animation-duration: 1s;
	z-index: 1000;
	background: none !important;
}

#wrapper .pagetop .top {
	position:relative;
	right: 0px;
	display: block;
	padding: 25px;
	text-decoration: none;
	
	border-radius: 50% ;
	border: 1px solid #FFF;
	background: rgba(31,44,92,0.8) !important;
	cursor:pointer;
}
.pagetop .top:before {
	position: absolute;
	top: 45%;
	left: 50%;
	display: block;
	width: auto;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	
	color: #FFF !important;
	font-size: calc( 1em + 20px);
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f106";
}
.pagetop.show {
	height: auto;
	opacity: 1;
	animation-name: fadein;
}
.pagetop.hide {
	height: 0;
	opacity: 0;
	animation-name: fadeout;
}
.pagetop.static {
	position: absolute;
	bottom: auto;
	margin: -35px 0 0;
}

@media only screen and (max-width: 767px) {
#wrapper .pagetop .top {
	padding: 20px;
}

.pagetop.static {
	margin: 5px 0 0;
}
}

@keyframes fadein {
  0% {
	height: 0;
	opacity: 0;
  }
  1% {
	height: auto;
	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@keyframes fadeout {
  0% {
	height: auto;
	opacity: 1;
  }
  99% {
	height: auto;
	opacity: 0;
  }
  100% {
	height: 0;
  }
}



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

	Print
	
===============================================================*/

/* print setting */
@media print {

@page {
    size: A4;
	/*margin: 12.7mm 9.7mm;*/
}

body {
	zoom: 1.8;
	width: 1050px;
	margin: auto;
}

#wrapper,
#grid,
#container { display: block;}

#left-column { float:left;}

#right-column { float:right;}

.pagetop { display: none;}

}

/* IE10以上 */
@media print and (-ms-high-contrast: none) {
    @page {
        size: A4;
    }

    body {
        zoom: 1.8;
        width: 1000px;
		margin: auto;
		
		/*
        transform: scale(0.5);
        transform-origin: 0 0;
		*/
    }
}