@charset "utf-8";

@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New&display=swap');

/* reset style
------------------------------------------------ */
*{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
body {
	line-height:1;
}

article, aside, dialog, figure, footer, header,
hgroup, nav, section {
	display:block;
}

h1,h2,h3,h4,h5,h6,p {
	font-weight:normal;
	font-size: 100%;
	text-align:left;
}

ol,ul,li,nav ul {
	list-style:none;
}

ul,li,img{
	margin:0;
	padding:0;
	list-style:none;
	vertical-align:bottom;
	line-height:1.6;
	text-align:left;
}

caption,th {
	text-align:left;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}

blockquote, q {
	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}

a {
	text-decoration:none;
	outline:0;
/* Hides from IE-mac \*/
	overflow:hidden;
/* End hide from IE-mac */
}

ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}

mark {
	background-color:#ff9;
	color:#000;
	font-style:italic;
	font-weight:bold;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom:1px dotted #000;
	cursor:help;
}

img,td,th {
	border:0;
}
a img{
	opacity:1;
	transition:all 0.3s linear;
}
a img:hover{
	opacity:0.5;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

td,th{
	text-align: left;
	vertical-align: top;
}

hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
	vertical-align:middle;
}


.clearfix:after,
p.text:after{
	content: ".";  
	display: block;  
	visibility: hidden;  
	height: 0.1px;  
	font-size: 0.1em;  
	line-height: 0;  
	clear: both;  
}
.clearfix,
p.text{display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
* html p.text { height: 1%;}
.clearfix,
p.text{display: block;}
/* End hide from IE-mac */




/* common
------------------------------------------------ */


body {
	margin:0;
	padding:0;
	font-size:16px;
	font-family:"Zen Kaku Gothic New", sans-serif;
	line-height:1.8;
	color:#323232;
	vertical-align:top;
	-webkit-text-size-adjust:100%;
}

a:link   {color:#006cb5;text-decoration:underline;}
a:visited{color:#006cb5;text-decoration:none;}
a:hover  {color:orange;text-decoration:none;}
a:active {color:#006cb5;text-decoration:none;}

input,select,textarea{
	max-width:100%;
	font-family:"Zen Kaku Gothic New", sans-serif;
}
textarea{
	width:100%;
}

a{
	transition:all 0.3s linear;
}
a:hover img{
    opacity:0.50;
    filter: alpha(opacity=50);
}
img{max-width:100%;height:auto;}

@media screen and (max-width:680px){
	body{
		font-size:14px;
	}
}
/* margin */
.mt0  {margin-top:0px!important;}
.mt5  {margin-top:5px!important;}
.mt10 {margin-top:10px!important;}
.mt15 {margin-top:15px!important;}
.mt20 {margin-top:20px!important;}
.mt25 {margin-top:25px!important;}
.mt30 {margin-top:30px!important;}
.mt40 {margin-top:40px!important;}
.mt50 {margin-top:50px!important;}
.mt60 {margin-top:60px!important;}
.mt90 {margin-top:90px!important;}
.mt120 {margin-top:120px!important;}
.mt150 {margin-top:150px!important;}

.mb0  {margin-bottom:0px!important;}
.mb5  {margin-bottom:5px!important;}
.mb10 {margin-bottom:10px!important;}
.mb15 {margin-bottom:15px!important;}
.mb20 {margin-bottom:20px!important;}
.mb25 {margin-bottom:25px!important;}
.mb30 {margin-bottom:30px!important;}
.mb40 {margin-bottom:40px!important;}
.mb50 {margin-bottom:50px!important;}
.mb60 {margin-bottom:60px!important;}
.mb90 {margin-bottom:90px!important;}
.mb120 {margin-bottom:120px!important;}
.mb150 {margin-bottom:150!important;}

.mr0  {margin-right:0px!important;}
.mr5  {margin-right:5px!important;}
.mr10 {margin-right:10px!important;}
.mr15 {margin-right:15px!important;}
.mr20 {margin-right:20px!important;}
.mr25 {margin-right:25px!important;}
.mr30 {margin-right:30px!important;}
.mr60 {margin-right:60px!important;}
.mr90 {margin-right:90px!important;}
.mr120 {margin-right:120px!important;}
.mr150 {margin-right:150px!important;}

.ml0  {margin-left:0px!important;}
.ml5  {margin-left:5px!important;}
.ml10 {margin-left:10px!important;}
.ml15 {margin-left:15px!important;}
.ml20 {margin-left:20px!important;}
.ml25 {margin-left:25px!important;}
.ml30 {margin-left:30px!important;}
.ml60 {margin-left:60px!important;}
.ml90 {margin-left:90px!important;}
.ml120 {margin-left:120px!important;}
.ml150 {margin-left:150px!important;}

/* padding */
.pt0  {padding-top:0px!important;}
.pt5  {padding-top:5px!important;}
.pt10 {padding-top:10px!important;}
.pt15 {padding-top:15px!important;}
.pt20 {padding-top:20px!important;}
.pt25 {padding-top:25px!important;}
.pt30 {padding-top:30px!important;}

.pb0  {padding-bottom:0px!important;}
.pb5  {padding-bottom:5px!important;}
.pb10 {padding-bottom:10px!important;}
.pb15 {padding-bottom:15px!important;}
.pb20 {padding-bottom:20px!important;}
.pb25 {padding-bottom:25px!important;}
.pb30 {padding-bottom:30px!important;}

.pr0  {padding-right:0px!important;}
.pr5  {padding-right:5px!important;}
.pr10 {padding-right:10px!important;}
.pr15 {padding-right:15px!important;}
.pr20 {padding-right:20px!important;}
.pr25 {padding-right:25px!important;}
.pr30 {padding-right:30px!important;}

.pl0  {padding-left:0px!important;}
.pl5  {padding-left:5px!important;}
.pl10 {padding-left:10px!important;}
.pl15 {padding-left:15px!important;}
.pl20 {padding-left:20px!important;}
.pl25 {padding-left:25px!important;}
.pl30 {padding-left:30px!important;}

.tL{text-align:left!important;}
.tR{text-align:right!important;}
.tC{text-align:center!important;}

.fR{float:right!important;}
.fL{float:left!important;}

.clear{clear:both!important;}

.dib{
	letter-spacing:-0.4em;
}
.dib *{
	letter-spacing:normal;
}
.dib li,
.dib dt,
.dib dd{
	display:inline-block;
	vertical-align:top;
	zoom:0;
}
p.note{
	font-size:12px;
}
a[href^="tel:"] {
	color:#323232;
    pointer-events: none;
	text-decoration:none;
	white-space:nowrap;
	cursor:default;
}
@media screen and (max-width: 990px) {
	a[href^="tel:"] {
   		pointer-events: auto;
		color:#006cb5;
		text-decoration:underline;
		cursor:pointer;
	}
	a[href^="tel:"]:hover{
		color:orange;
	}
}

/* header
------------------------------------------------ */
div#header{
	position:relative;
	padding:30px 30px 0;
}
div#header h1#site_logo{
	max-width:345px;
	margin:-10px 0 10px;
}

/* slideshow */
div#slideshow{
	width:100vw;
	margin:0 0 0 -30px;
}
div#slideshow ul{
	position: relative;
	min-width:1024px;
	margin: 0;
	z-index:1;
}
div#slideshow ul#slider li a,
div#slideshow ul#slider li span{
	width:100%;
	display:block;
	padding:20% 0 0 0;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
}
div#slideshow div.bx-wrapper div.bx-pager {
	padding-right:120px;
	text-align: right;
}
@media screen and (min-width:1024px){
	div#slideshow ul#slider li a,
	div#slideshow ul#slider li span{
		padding-top:200px;
	}
}
@media screen and (max-width:480px){
	div#header h1#site_logo {
		margin-left:-15px;
	}
}
@media screen and (max-width:460px){
	div#header h1#site_logo {
		width:calc(100%*345/460/0.9);
	}
}

/* btn_menu */
button#btn_menu {
	display:none;
	opacity: 0;
	z-index: 9999;
}
@media screen and (max-width: 760px){
	button#btn_menu {
		width: 90px;
		height: 90px;
		position: fixed;
		top: 0;
		right: 0;
		display: block;
		text-align: center;
		border: none;
		transition: all 0.3s linear;
		background: #003366;
		opacity: 1.0;
		transition: all 0.3s linear;
		z-index: 999;
		overflow: hidden;
	}
}
@media screen and (max-width: 960px){
	button#btn_menu {
		width: 90px;
		height: 90px;
		position: fixed;
		top: 0;
		right: 0;
		display: block;
		text-align: center;
		border:none;
		transition: all 0.3s linear;
		background:#006cb5;
		opacity: 1.0;
		transition: all 0.3s linear;
		overflow:hidden;
		z-index:99999;
	}
	button#btn_menu:hover {
		background-color:#ff6400;
	}
	button#btn_menu.close {
		background-image:none;
		background-blend-mode:lighten;
	}
	button#btn_menu:before,
	button#btn_menu:after{
		width:32px;
		height:5px;
		content:"";
		position:absolute;
		top:27.5px;
		left:29px;
		display:block;
		background-color:#fff;
		transition:all 0.3s ease-out;
		z-index:10;
	}
	button#btn_menu:after{
		top:auto;
		bottom:27.5px;
	}
	button#btn_menu.close:before,
	button#btn_menu.close:after{
		top:42.5px;
		bottom:auto;
		transition:all 0.3s ease-out;
	}
	button#btn_menu.close:before{
		transform:rotate(-225deg)
	}
	button#btn_menu.close:after{
		top:auto;
		bottom:42.5px;
		transform:rotate(225deg);
	}
	button#btn_menu span{
		width:32px;
		height:5px;
		display:block;
		position:absolute;
		top:50%;
		left:50%;
		margin:-2.5px 0 0 -16px;
		background-color:#fff;
		transition:all 0.3s ease-out;
	}
	button#btn_menu.close span{
		width:0;
		margin:-0.5vw 0 0 0;
		opacity:0;
	}
}
@media screen and (max-width:540px){
	button#btn_menu {
		width: calc(20vw - 3px);
		height: calc(20vw - 3px);
	}
	button#btn_menu:before,
	button#btn_menu:after{
		width:10vw;
		height:1vw;
		top:5vw;
		left:calc(5vw - 1.5px);
	}
	button#btn_menu:after{
		top:auto;
		bottom:5vw;
	}
	button#btn_menu.close:before,
	button#btn_menu.close:after{
		top:calc(9.5vw - 1.5px);
	}
	button#btn_menu span{
		width:10vw;
		height:1vw;
		margin:-0.5vw 0 0 -5vw;
	}
}

/* globalnavi
------------------------------------------------ */
div#global_navi{
	width:calc(100% - 345px);
	position:absolute;
	right:30px;
	top:25px;
	z-index:99999;
}
ul#gnavi{
	width: 100%;
	clear: both;
	margin:0 auto 10px;
	padding: 0;
	text-align:right;
	letter-spacing: -0.4em;
}
ul#gnavi li{
	position: relative;
	display: inline-block;
	font-size:18px;
	text-align:center;
	letter-spacing: normal;
	vertical-align: middle;
}
ul#gnavi li:nth-child(7){
	margin-left:10px;
}
ul#gnavi li a{
	display: block;
	padding:25px 10px;
	transition:all 0.3s linear;
	line-height:1.5;
}
ul#gnavi li:nth-child(7) a{
	padding:25px 15px;
	color:#fff;
	border-radius:10px;
	background-color:#006cb5;
}
ul#gnavi li ul{
	display: none;
	width:18em;
	position: absolute;
	top:calc(1.5em + 50px + 1px);
	left: 50%;
	margin-left: -9em;
	border:1px #ccc solid;
	z-index: 1000;
}
ul#gnavi li:nth-child(7) ul{
	left: auto;
	right:0;
}{
	margin-left:10px;
}
ul#gnavi li ul li{
	display:block;
	font-size:16px;
}
ul#gnavi li ul li:nth-child(7){
	margin-left:0;
}
ul#gnavi li ul li a,
ul#gnavi li:nth-child(7) ul li a,
ul#gnavi li ul li:nth-child(7) a{
	padding:15px 15px 16px;
	color:#006cb5;
	border-radius:0;
	border-bottom:1px #ccc solid;
	background-color:rgba(255,255,255,0.9);
}
ul#gnavi li ul li a:hover,
ul#gnavi li:nth-child(7) ul li a:hover,
ul#gnavi li ul li:nth-child(7) a:hover{
	color:white;
	border-bottom:1px orange solid;
	background-color:orange;
}
ul#gnavi li ul li:last-child a,
ul#gnavi li ul li:last-child a:hover{
	border-bottom: none;
}

/* transform */
div#header.transform ul#gnavi{
	position:fixed;
	top:0;
	right:0;
	margin-bottom:0;
	background-color: rgba(255,255,255,0.85);
	z-index: 99999;
}
div#header.transform ul#gnavi li a {
	padding: 10px;
}
div#header.transform ul#gnavi li a{
	border-radius:0 0 0 10px;
}
div#header.transform ul#gnavi li ul{
	top:calc(1.5em + 20px + 1px);
}
div#header.transform ul#gnavi li ul li a{
	border-radius:0;
}
	

@media screen and (max-width:1100px) {
	ul#gnavi li a{
		font-size:16px;
		}
	ul#gnavi li a{
		padding:25px 5px;
	}
}
@media screen and (max-width: 960px) {
	div#global_navi{
		display:none;
		width:360px;
		position:fixed;
		top:0;
		right:0;
		margin:0;
		padding:0;
		background-color:rgba(255,255,255,0.9);
		z-index:99999;
	}
	ul#gnavi {
		width:100%;
		height:100vh;
		display:block;
		padding:120px 0 0 0;
		overflow-x:auto;
	}
	ul#gnavi li {
		display:block;
		width:100%;
		padding:0;
	}
	ul#gnavi li:nth-child(7){
		margin-left:0;
	}
	ul#gnavi li a,
	ul#gnavi li:nth-child(7) a{
		height:inherit;
		margin:0;
		padding:10px 15px 10px 60px;
		font-size:16px;
		text-align:left;
		text-indent:0;
		-moz-border-radius:0;
		-webkit-border-radius:0;
		border-radius:0;
		background:transparent url(../img/arr.png) no-repeat left 30px top 12px / 20px auto;
		box-shadow:none;
	}
	ul#gnavi li:nth-child(7) a{
		color:#006cb5;
	}
	ul#gnavi li a:hover,
	ul#gnavi li a ul li a:hover {
		margin:0!important;
		color:#fff!important;
		background-color:orange!important;
	}
	ul#gnavi li a:before,
	ul#gnavi li a:after {
		display:none;
	}
	ul#gnavi li ul {
		width:100%;
		height:auto;
		display:none;
		position:static;
		margin:0;
		padding:0;
		border:none;
		-moz-border-radius:0;
		-webkit-border-radius:0;
		border-radius:0;
		background:none
	}
	ul#gnavi li ul li a {
		padding:10px 15px 10px 60px;
		text-align:left;
		border-bottom: 1px #ccc solid !important;
	}
	ul#gnavi li ul li a,
	ul#gnavi li:nth-child(7) ul li a,
	ul#gnavi li ul li:nth-child(7) a {
		padding: 10px 0 10px 60px;
		border-radius:0;
		background-image:none;
		background-color: rgba(245,245,240,1.0);
	}
	div#header.transform ul#gnavi{
		position:relative;
	}
	div#header.transform ul#gnavi li a {
		padding: 10px 15px 10px 60px;
	}
}
@media screen and (max-width: 420px) {
	div#global_navi{
		width:calc(100% - 60px);
	}
	ul#gnavi li a,
	ul#gnavi li:nth-child(7) a{
		font-size:14px;
	}
}

/* pagenavi
------------------------------------------------ */
ul#pagenavi{
	width:100%;
	margin:0 auto 90px;
	padding:0 30px;
	background-color:#ebebeb;
}
ul#pagenavi li{
	min-height:18px;
	margin:0 10px 0 0;
	padding: 2px 0 0 25px;
	background:url(../img/arr.png) no-repeat left top 0.5em/ 15px auto;
}
ul#pagenavi li:first-child{
	background: url(../img/icon_home.png) no-repeat 0 center / 20px auto;;
}

@media screen and (max-width:540px){
	ul#pagenavi{
		display:none;
	}
}

/* contents
------------------------------------------------ */
div#contents{
	width:calc(100% - 200px);
	margin:0 auto 90px;
	padding:0 0 5%
	background-color:#fff;
	overflow:hidden;
}
@media screen and (max-width:960px){
	div#contents{
		width:calc(100% - 120px);
	}
}
@media screen and (max-width:640px){
	div#contents{
		width:calc(100% - 60px);
	}
}
@media screen and (max-width:540px){
	div#contents{
		width:calc(100% - 30px);
	}
}



/* pagetitle
------------------------------------------------ */
h1#cttl{
	width: 100%;
	max-width:22em;
	height: 20vw;
	position:absolute;
	top: 90px;
	left: calc(50% - 11em);
	margin:0 auto;
	display: flex;
	justify-content: center;
	align-items: center;
	color:#fff;
	text-align:center;
	background-color:rgba(0,0,0,0.5);
}
h1#cttl strong{
	display:block;
	margin:0 auto;
	padding:0;
	font-size:36px;
	text-align:center;
	line-height:1.4;
	letter-spacing:0.15em;
}
h2.ttl{
	clear:both;
	margin-bottom:30px;
}

/* topicpath
------------------------------------------------ */


/* footer
------------------------------------------------ */

div#footer{
	padding-top:120px;
	background-color:#f0f0f0;
}
div#footer div.inner{
	width:calc(100% - 180px);
	margin:0 auto;
	letter-spacing:-0.4em;
}
div#footer div.inner *{
	letter-spacing:normal;
}
div#footer p.add{
	width:460px;
	display:inline-block;
	margin-right:30px;
	text-align:left;
	vertical-aling:top;
}
div#footer p.add img{
	display:block;
	mix-blend-mode:darken;
}
div#footer p.add img:nth-child(1){
	width:150px;
	margin:0 0 15px calc(172px - 75px);
}
div#footer p#copyright{
	margin-bottom:0;
	padding:20px 15px 18px;
	color:#fff;
	text-align:center;
	background-color:#969696;
}

@media screen and (max-width:1280px){
	div#footer{
		padding-top:90px;
	}
	div#footer p.add{
		width:460px;
		display:block;
		margin:0 auto 60px;
		text-align:center;
	}
	div#footer p.add img,
	div#footer p.add img:nth-child(1){
		margin:0 auto;
	}
	div#footer p.add img:nth-child(1){
		max-width:32.6%;
		margin-bottom:15px;
	}
}
@media screen and (max-width:760px){
	div#footer div.inner{
		width:calc(100% - 60px);
	}
}
@media screen and (max-width:540px){
	div#footer{
		padding-top:60px;
	}
	div#footer div.inner{
		width:calc(100% - 30px);
		overflow:hidden;
	}
}
@media screen and (max-width: 520px) {
	div#footer p.add {
		width: 100%;
		max-width:345px;
		font-size:12px;
		text-align:left;
	}
}
@media screen and (max-width: 375px) {
	div#footer p.add img:nth-child(1){
		max-width:32.6%;
		margin-bottom:15px;
	}
}

/* footer_bnr
------------------------------------------------ */
ul#footer_bnr{
	width:100%;
	margin-bottom:60px;
	text-align:center;
}
ul#footer_bnr li{
	max-width:90%;
	margin-bottom:15px;
	text-align:center;
}
ul#footer_bnr li:nth-child(1){
	width:458px;
}


/* fnavi
------------------------------------------------ */
div#footer nav{
	width:calc(100% - 460px - 30px);
	display:inline-block;
	margin-bottom:30px;
	vertical-align:top;
	letter-spacing:-0.4em;
}
div#footer ul#fnavi{
	width:100%;
	letter-spacing:-0.4em;
}
ul#fnavi li{
	width:calc(33.33% - 20px);
	display:inline-block;
	margin-right:30px;
	padding:5px 0;
	vertical-align:top;
	letter-spacing:normal;
}
ul#fnavi li strong{
	font-size:20px;
}
ul#fnavi li:nth-child(3n){
	margin-right:0;
}
ul#fnavi li ul{
	margin-bottom:30px;
}
ul#fnavi li ul li{
	width:100%;
	position:relative;
	display:block;
	margin-right:0;
	padding-left:2.5em;
}
ul#fnavi li ul li:hover:before{
	width:2em;
	height:1px;
	content:"";
	position:absolute;
	top:calc(0.85em + 5px);
	left:0;
	display:block;
	background-color:#006cb5;
}
ul#fnavi li ul li a{
	font-size:14px;
}

@media screen and (max-width:1280px){
	div#footer nav{
		width:100%;
	}
}
@media screen and (max-width:960px){
	ul#fnavi li{
		width:calc(50% - 15px);
	}
	ul#fnavi li:nth-child(3n){
		margin-right:15px;
	}
	ul#fnavi li:nth-child(2n){
		margin-right:0;
	}
}
@media screen and (max-width:540px){
	ul#fnavi li ul{
		margin-bottom:0;
	}
}
@media screen and (max-width:420px){
	ul#fnavi li{
		width:100%;
	}
	ul#fnavi li:nth-child(3n){
		margin-right:0;
	}
	ul#fnavi li strong {
		font-size: 18px;
	}
}

/* go to top and chara
------------------------------------------------ */
div.side{
	width:100px;
	position:fixed;
	bottom:15px;
	right:15px;;
	z-index: 9999;
}
div.side a#gototop{
	width:100px;
	height:100px;
	display:block;
	padding-top:65px;
	text-align:center;
	line-height:1;
	border:1px #006ab6 solid;
	border-radius:58px;
	background:#fff url(../img/pagetop.gif) no-repeat center top 15px / calc(100%*52/100) auto;
}
div.side a#gototop:hover{
	color:#fff;
	border:1px orange solid;
	background-color:orange;
	transform:scale(0.85);
}
div.side a#jyunka{
	width:100px;
	display:block;
	margin-bottom:10px;
	padding-top:calc(100px*437/300 + 5px);
	font-size:10px;
	text-align:center;
	background:url(../img/jyunka.webp) no-repeat center top / 100% auto;
}

div.side a#llamatchi{
	width:100px;
	display:block;
	margin-bottom:10px;
	padding-top:calc(100px*412/280 + 5px);
	font-size:10px;
	text-align:center;
	background:url(../img/llamatchi.webp) no-repeat center top / 100% auto;
}
div.side a#jyunka:hover,
div.side a#llamatchi:hover{
	animation:0.3s pyonpyon linear infinite;
}
@keyframes pyonpyon{
	0%  {margin-top:0;margin-bottom:10px;}
	25% {margin-top:-10px;margin-bottom:20px;}
	50% {margin-top:-12px;margin-bottom:22px;}
	75% {margin-top:-10px;margin-bottom:20px;}
	100%{margin-top:0;margin-bottom:10px;}
}
@media screen and (max-width:1280px){
	div.side{
		width:70px;
	}
	div.side a#gototop{
		width:70px;
		height:70px;
		padding-top:calc(65px*0.7);
		font-size:12px;
		border-radius:calc(58px*0.7);
	}
	div.side a#jyunka{
		width:70px;
		padding-top:calc(70px*437/300);
	}
	div.side a#llamatchi{
		width:70px;
		padding-top:calc(70px*412/280);
	}
}
@media screen and (max-width:960px){
	div.side{
		width:100%;
		text-align:right;
	}
	div.side a#gototop,
	div.side a#jyunka,
	div.side a#llamatchi{
		display:inline-block;
		margin-bottom:0;
	}
	div.side a#jyunka{
		width:50px;
		padding-top:calc(50px*437/300);
	}
	div.side a#llamatchi{
		width:50px;
		padding-top:calc(50px*412/280);
	}
	div.side a#jyunka p,
	div.side a#llamatchi p{
		display:none;
	}
}
@media screen and (max-width:540px){
	div.side{
		bottom:5px;
	}
}

/* topics_list,activity_report_list
------------------------------------------------ */
div#concept,
div#topics_list,
div#activity_report_list{
	max-width: 1280px;
	margin:0 auto 60px;
	clear:both;
	overflow:hidden;
	background-color:#fff;
}
div#concept h1.ttl,
div#topics_list h1.ttl,
div#activity_report_list h1.ttl{
	width:8em;
	float:left;
	margin:0 30px 15px 0;
	font-family: 'Sawarabi Mincho';
	font-size:32px;
}
div#topics_list a.link,
div#activity_report_list a.link{
	float:left;
	margin-top:20px;
}
ul.pickup{
	clear:both;
}
ul.pickup li{
	width:22%;
	margin:0 4% 30px 0;
}
ul.pickup li:nth-child(4n){
	margin-right:0;
}
ul.pickup li a,
ul.pickup li span.text{
	width:100%;
	display:block;
	margin:0 auto;
}
ul.pickup li a span,
ul.pickup li span.text span{
	width:100%;
	position:relative;
	display:block;
	margin:0 auto 10px;
	padding:75% 0 0 0;
	border-radius:6px;
	-webkit-border-radius:6px;
	-moz-border-radius:6px;
	-ms-border-radius:6px;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:100% auto;
	transition:all 0.3s linear;
}
ul.pickup li a:hover span,
ul.pickup li span.text:hover span{
	background-size:115% auto;
	transition:all 0.3s linear;
}
ul.list{
	clear: both;
	margin-bottom:30px;
	padding:0 0 15px;
	letter-spacing:-0.4em;
	border-bottom:1px #ccc solid;
	overflow: hidden;
}
ul.list li{
	position:relative;
	padding:15px 0;
	border-top:1px #ccc solid;
}
ul.list li span.date,
ul.list li a,
ul.list li span.text{
	width:12em;
	display:inline-block;
	margin:0;
	vertical-align:top;
	letter-spacing:normal;
}
ul.list li a,
ul.list li span.text{
	width:calc(100% - 12em);
	padding:0;
}
span.date{
	min-height:18px;
	padding: 2px 0 0 0;
	background: url(../img/arrow01.png) no-repeat 0 center;
}
ul.pickup li span.date{
	padding-left:0;
}
span.new,
ul.pickup li a span.new{
	width: auto;
	display: inline-block;
	margin: 0;
	padding:0 5px 0 0;
	color:red;
	font-weight:bold;
	letter-spacing:normal;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-ms-border-radius: 0;
}
ul.pickup li a span.new:before{
	display:none!important;
}
@media screen and (max-width:1580px){
	div#concept, div#topics_list,
	div#activity_report_list {
		width: calc(100vw - 200px);
	}
}
@media screen and (max-width:960px){
	div#concept, div#topics_list,
	div#activity_report_list {
		width: 100%;
	}
}
@media screen and (max-width:680px){
	ul.pickup li{
		width:30%;
		margin:0 5% 15px 0;
		font-size:14px;
	}
	ul.pickup li:nth-child(3n){
		margin-right:0;
	}
	ul.pickup li:nth-child(4n){
		display:none;
	}
	ul.list li span.date, ul.list li a,
	ul.list li span.text {
		width: 10em;
		font-size:14px;
	}
	ul.list li a,
	ul.list li span.text {
		width: calc(100% - 10em);
		font-size:14px;
	}
	ul.pickup li a span,
	ul.pickup li span.text span{
		margin:0 auto 5px;
	}
}
@media screen and (max-width:540px){
	div#concept h1.ttl,
	div#topics_list h1.ttl,
	div#activity_report_list h1.ttl {
		width: auto;
		float: none;
		margin: 0 0 -10px;
	}
	div#topics_list a.link,
	div#activity_report_list a.link {
		display:block;
		float: none;
		margin: 0 0 30px;
	}
	ul.pickup li{
		width:47.5%;
		margin:0 5% 30px 0;
		font-size:14px;
	}
	ul.pickup li:nth-child(3n){
		margin-right:5%;
	}
	ul.pickup li:nth-child(2n),
	ul.pickup li:nth-child(4n){
		margin-right:0;
	}
	ul.pickup li:nth-child(4n){
		display:inline-block;
	}
	ul.list {
		padding: 0;
	}
	ul.list li span.date,
	ul.list li a,
	ul.list li span.text{
		width:100%;
		display:block;
		margin:0 0 15px;
	}
	ul.list li span.text{
		margin:0;
	}
	span.date {
		font-size:12px;
	}
}
@media screen and (max-width:350px){
	div#topics_list h1.ttl,
	div#activity_report_list h1.ttl {
		font-size: 28px;
	}
}


/* second
------------------------------------------------ */

h2#pttl{
	width:480px;
	position:relative;
	margin:0 auto 60px;
	padding:0 0 15px;
	font-size:28px;
	font-weight:bold;
	text-align:center;
	border-bottom:1px #4e7aff solid;
}
h2#pttl strong{
	width: calc(90vw - 120px);
    position: relative;
	display: block;
	margin-left: calc(-45vw + 300px);
	z-index:2;
}
h2#pttl:after{
	width:17px;
	height:17px;
	content:"";
	position:absolute;
	bottom:-9px;
	left:calc(50% - 17px/2);
	display:block;
	text-align:center;
	letter-spacing:normal;
	border-bottom:1px #4e7aff solid;
	border-right:1px #4e7aff solid;
	background-color:#fff;
}
div#topics_list ul.pickup li span:before,
div#topics_list ul.list li:before,
body.pages h2#pttl:before{
	width:9em;
	content:"";
	position:absolute;
	top:13px;
	left:6em;
	display:block;
	padding:0.4em 0 calc(0.4em + 2px);
	color:#fff;
	text-align:center;
	letter-spacing:normal;
	line-height:1;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
}
h2#pttl:after{
	width:17px;
	height:17px;
	transform:rotate(45deg);
}
body.pages h2#pttl:before{
	position: static;
	display: inline-block;
	margin-bottom: 15px;
	color:#fff;
	font-size: 16px;
}
div#topics_list ul.pickup li span::before{
	top:auto;
	bottom:5px;
	left:5px;
}
body.pages h2#pttl.topics:before,
div#topics_list ul.pickup li.topics span:before,
div#topics_list ul.list li.topics:before  {content:"お知らせ";background-color:#008caa;}
body.pages h2#pttl.seminer:before,
div#topics_list ul.pickup li.seminer span:before,
div#topics_list ul.list li.seminer:before{content:"研修・セミナー";background-color:#00aaff;}
body.pages h2#pttl.health:before,
div#topics_list ul.pickup li.health span:before,
div#topics_list ul.list li.health:before{content:"産業保健関係情報";background-color:#1f9a6e;}
body.pages h2#pttl.visiting:before,
div#topics_list ul.pickup li.visiting span:before,
div#topics_list ul.list li.visiting:before{content:"個別訪問支援";background-color:#829632;}
body.pages h2#pttl.press:before,
div#topics_list ul.pickup li.press span:before,
div#topics_list ul.list li.press:before{content:"プレスリリース";background-color:#557fb4;}
body.pages h2#pttl.other:before,
div#topics_list ul.pickup li.other span:before,
div#topics_list ul.list li.other:before{content:"その他";background-color:#919191;}

@media screen and (max-width:1054px){
	div#topics_list ul.list li::before {
		left: 6em;
	}
}
@media screen and (min-width:1024px){
	h1#cttl {
		height: 200px;
	}
}
@media screen and (max-width:960px){
	#mental_health_support h1#cttl strong{
		letter-spacing:0;
	}
}
@media screen and (max-width:680px){
	h2#pttl {
		padding: calc(1em + 19px) 0 0 0;
	}
}
@media screen and (max-width:540px){
	h1#cttl strong{
		font-size: 30px;
	}
	h2#pttl{
		width:100%;
		font-size: 24px;
	}
	h2#pttl::before,
	div#topics_list ul.pickup li span::before,
	div#topics_list ul.list li::before {
		left: auto;
		right:0;
	}
	h2#pttl strong {
		width:100%;
		margin-left: 0;
	}
	#mental_health_support h1#cttl strong{
		font-size:26px;
		line-height:1.2;
	}
}
@media screen and (max-width:460px){
	h1#cttl{
		top:calc(100vw*345/460*60/345 + 30px*0.9);
	}
}
@media screen and (max-width:420px){
	h1#cttl strong{
		font-size: 26px;
	}
	h2#pttl{
		width:100%;
		font-size: 20px;
	}
	#mental_health_support h1#cttl strong{
		font-size:22px;
	}
}
@media screen and (max-width:350px){
	h1#cttl strong{
		font-size: 22px;
	}
	h2#pttl{
		font-size: 18px;
	}
	h2#pttl::before,
	div#topics_list ul.pickup li span::before,
	div#topics_list ul.list li::before {
		width:9em;
	}
}


/* outline */
p#outline strong{
	color:red;
	font-weight:bold;
}

/* slide_show */
@media screen and (max-width:1300px){
	div.bx-wrapper div.bx-pager.bx-default-pager a {
		width: 45px;
	}
}
@media screen and (max-width:960px){
	div.bx-wrapper div.bx-pager.bx-default-pager a {
		width: 30px;
	}
}
@media screen and (max-width:760px){
	div.bx-wrapper div.bx-pager.bx-default-pager a {
		display:none;
	}
}

/* calendar
------------------------------------------------ */
div.calendar{
	width:100%;
	position:relative;
	float:left;
	overflow:hidden;
}
div.calendar + div.calendar{
	margin:30px auto 60px;
}
div.calendar h4.month{
	padding:13px 15px 15px;
	font-size:24px;
	font-weight:bold;
	text-align:center;
}
div.calendar a.btn{
 	width: 8em;
	position:absolute;
	top:0;
	padding:13px 15px 15px;
	color:#fff;
	text-align:center;
	border-radius:30px;
	background-color:#006cb5;
	background-repeat:no-repeat;
}
div.calendar a.btn.prev{
	left:0;
	padding-left:45px;
	background-image:url(../img/arrs_r.png);
	background-position:left 20px center;
}
div.calendar a.btn.next{
	right:0;
	padding-right:30px;
	background-image:url(../img/arrs.png);
	background-position:right 20px center;
}
div.calendar table{
	width:100%;
	border-right:1px #ccc solid;
	border-bottom:1px #ccc solid;
}
div.calendar table tr th,
div.calendar table tr td{
	width:calc(100%/7);
	padding:3px;
	text-align:center;
	border-top:1px #ccc solid;
	border-left:1px #ccc solid;
}
div.calendar table tr th{
	font-weight:bold;
}
div.calendar table tr th:nth-child(7n+1),
div.calendar table tr td:nth-child(7n+1){
	color:#c80000;
	background-color:#ffebee;
}
div.calendar table tr th:nth-child(7n),
div.calendar table tr td:nth-child(7n){
	color:#0064c8;
	background-color:#d5f1ff;
}
div.calendar table tr td a{
	display:block;
	font-size:10px;
	line-height:1.4;
}
@media screen and (min-width:1280px){
	div.calendar{
		width:calc(50% - 15px);
		margin-bottom:30px;
	}
	div.calendar + div.calendar{
		margin-left:30px;
	}
}
@media screen and (max-width:540px){
	div.calendar + div.calendar {
		margin: 30px auto;
	}
}

/* function
------------------------------------------------ */
a.link{
	min-height:1.5em;
	display:block;
	padding:10px 0 10px calc(1.5em + 10px);
	background:url(../img/arr.png) no-repeat left top 12px / 1.5em auto;
}
a.link:hover{
	background:url(../img/arr_o.png) no-repeat left top 7px / 1.5em auto;
}
a.btn{
	width:100%;
	max-width:calc(33.33% - 0.2em);
	display:inline-block;
	margin:0 auto 15px;
	padding:10px 15px;
	text-align:center;
	vertical-align: top;
	border:1px #006cb5 solid;
	border-radius:calc(0.9em + 10px);
}
a.btn:hover{
	color:#fff;
	border:1px orange solid;
	background-color:orange;
}
@media screen and (max-width:540px){
	a.btn{
		max-width:none;
	}
}