@charset "utf-8";
html, body {
    height: 100%;
    -webkit-text-size-adjust: 100%;/*スマホ縦横文字自動調整をオフ*/
}
*{
	padding:0; margin:0;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	border: 0;
	font-style:normal;
	font-size: 100%;
	vertical-align: baseline;}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block;}
html{ overflow-y: scroll;}
blockquote, q {
	quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;}
input, textarea{
	margin: 0;
	padding: 0;}
textarea{ width: 100%; }
ol, ul{ list-style:none; }
table{
	border-collapse: collapse; 
  border-spacing:0;}
caption, th{ text-align: left; }
a:focus { outline:none; }
.both{ clear:both; }
table { width:100%;}
  
.inline_block {  
	display: inline-block;  
	*display: inline;  
	*zoom: 1;}
	
img {
	font-size:0;
	line-height: 0;
	border:0;
	vertical-align: bottom !important;}

/*レスポドロップダウンメニューで使用*/
.clearfix::after {
  clear: both;
  content: " ";
  display: block;
  font-size: 0;
  height: 0;
  visibility: hidden;}
	
.blank a[target="_blank"] {
	padding-right: 24px;
  background: url("../img/icn_external.png") no-repeat scroll right center rgba(0, 0, 0, 0);}
a[href^="mailto:"] {
	padding-right: 24px;
    background: url("../img/icn_mail.png") no-repeat scroll right center rgba(0, 0, 0, 0);}
a[href$=".pdf"], a[href$=".xlsx"] {
	padding-right: 24px;
  background: url("../img/icn_pdf.png") no-repeat scroll right center rgba(0, 0, 0, 0);}
a[href$=".xls"], a[href$=".xlsx"] {
	padding-right: 24px;
  background: url("../img/icn_excel.png") no-repeat scroll right center rgba(0, 0, 0, 0);}
a[href$=".doc"], a[href$=".docx"] {
	padding-right: 24px;
    background: url("../img/icn_word.png") no-repeat scroll right center rgba(0, 0, 0, 0);}
a[href$=".ppt"], a[href$=".pptx"] {
	padding-right: 24px;
    background: url("../img/icn_powerpoint.png") no-repeat scroll right center rgba(0, 0, 0, 0);}
a[href$=".zip"] {
	padding-right: 24px;
    background: url("../img/icn_zip.png") no-repeat scroll right center rgba(0, 0, 0, 0);}

/*▽js_inview*/	
/*----- フェードイン -----*/
.js_fadeIn {
	opacity: 0;
	transition: 2.0s;}
.js_fadeIn_on {
	opacity: 1.0;}

/*----- 上へスライド -----*/
.js_Up {
	transform: translate(0, 40px);
	-webkit-transform: translate(0, 40px);
	transition: .8s;}
.js_Up_on {
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);}

/*----- ズームイン -----*/
.js_zoomIn {
	transform: scale(0, 0);
	-webkit-transform: scale(0, 0);
	transition: .8s;}
.js_zoomIn_on {
	transform: scale(1, 1);
	-webkit-transform: scale(1, 1);} 

/*----- フェードインしながら上へスライド -----*/
.js_fadeInUp {
	opacity: 0;
	transform: translate(0, 60px);
	-webkit-transform: translate(0, 60px);
	transition: .8s;}
.js_fadeInUp_on {
	opacity: 1.0;
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);}

/*----- フェードインしながら左からスライド -----*/
.js_fadeInLeft {
	opacity: 0;
	transform: translate(-100px, 0);
	-webkit-transform: translate(-100px, 0);
	transition: .8s;}
.js_fadeInLeft_on {
	opacity: 1.0;
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);}

/*----- フェードアウトしながら左からスライド -----*/
.js_fadeOutLeft {
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	transition: .3s;}
.js_fadeOutLeft_on {
	transform: translate(-100%, 0);
	-webkit-transform: translate(-100%, 0);}

/*----- フェードインしながら右からスライド -----*/
.js_fadeInRight {
	opacity: 0;
	transform: translate(100px, 0);
	-webkit-transform: translate(100px, 0);
	transition: .8s;}
.js_fadeInRight_on {
	opacity: 1.0;
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);}

/*----- フェードアウトしながら右からスライド -----*/
.js_fadeOutRight {
	opacity: 1.0;
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	transition: .8s;}
.js_fadeOutRight_on {
	opacity: 0;
	transform: translate(100%, 0);
	-webkit-transform: translate(100%, 0);}

/*----- ロールオーバーズーム -----*/
.js_zoom{
	-moz-transform: scale(1.0);
    -webkit-transform: scale(1.0);
    -ms-transform: scale(1.0);
    transform: scale(1.0); 
	-webkit-transition: all 2.0s ease-out;
    -moz-transition: all 2.0s ease-out;
    -ms-transition: all 2.0s ease-out;
    transition: all 2.0s ease-out; }
.js_zoom:hover{
  -moz-transform: scale(1.05);
  -webkit-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05); }

/* タイピング （jsあり)　*/
.typ { opacity: 0; }
.typ span { opacity: 0; display: inline-block !important; }

/* 点滅 */
.blink{
	-webkit-animation: blink 2.0s ease-in-out infinite alternate;
	-moz-animation: blink 2.0s ease-in-out infinite alternate;
  animation: blink 2.0s ease-in-out infinite alternate;}
	@-webkit-keyframes blink{
			60% {opacity:0.6;}
			100% {opacity:1;}
	}
	@-moz-keyframes blink{
			60% {opacity:0.6;}
			100% {opacity:1;}
	}
	@keyframes blink{
			60% {opacity:0.6;}
			100% {opacity:1;}
	}

/*　ふわふわ　*/
.fuwafuwa { animation: fuwafuwa 3s infinite; }
@keyframes fuwafuwa {
  0% { transform: translate(0,0); }
  50% { transform: translate(0,10px); }
  100% { transform: translate(0,0); }
}

/* ズーム */
.zoom{ animation: zoom 10s infinite;}
@keyframes zoom {
0% {
	-moz-transform: scale(1.0);
    -webkit-transform: scale(1.0);
    -ms-transform: scale(1.0);
    transform: scale(1.0); }
50%{
  -moz-transform: scale(1.05);
  -webkit-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05); }
100% {
	-moz-transform: scale(1.0);
    -webkit-transform: scale(1.0);
    -ms-transform: scale(1.0);
    transform: scale(1.0); }
}

/* ホバースライド */
.h_slide:hover{ animation: hslide 1s infinite; }
@keyframes hslide {
  0% { transform: translate(0,0); }
  100% { transform: translate(10px,0); } }

/* ディレイ */
.delay02{ transition-delay: 0.2s; -webket-transition-delay: 0.2s; }
.delay03{ transition-delay: 0.3s; -webket-transition-delay: 0.3s; }
.delay04{ transition-delay: 0.4s; -webket-transition-delay: 0.4s; }
.delay05{ transition-delay: 0.5s; -webket-transition-delay: 0.5s; }
.delay06{ transition-delay: 0.6s; -webket-transition-delay: 0.6s; }
.delay08{ transition-delay: 0.8s; -webket-transition-delay: 0.8s; }
.delay09{ transition-delay: 0.9s; -webket-transition-delay: 0.9s; }
.delay10{ transition-delay: 1.0s; -webket-transition-delay: 1.0s; }
.delay12{ transition-delay: 1.2s; -webket-transition-delay: 1.2s; }
.delay15{ transition-delay: 1.5s; -webket-transition-delay: 1.5s; }

.btn_style a:hover{
	display: block !important;
	text-decoration: none; }
.btn_style::before,
.btn_style::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';}
	.btn_style,
	.btn_style::before,
	.btn_style::after {
		-webkit-transition: all .4s;
		transition: all .4s;}

/* 1. 背景カラーをふわっと変更 */
.btn_style1{ background: #000; }
.btn_style1:hover {
	background: rgba(0,160,234,1.00) !important;
	text-decoration: none;}

/* 2.背景・ボーダー・文字カラーをふわっと変更 */
.btn_style2 {}
	.btn_style2:hover {
		background: #fff !important;
        border: 1px #000 solid !important;
		text-decoration: none; }

/* 3. 背景カラーが左右に分かれていく */
.btn_style3 {
	position: relative;
	z-index: 2;
	color: #fff !important;
	background: rgba(0,160,234,1.00);}
	.btn_style3:hover {
		text-decoration: none;}
		.btn_style3::before,
		.btn_style3::after {
			top: 0;
			width: 50%;
			height: 100%;
			background: #000;}
		.btn_style3::before {
			right: 0;}
		.btn_style3::after {
			left: 0;}
		.btn_style3:hover::before,
		.btn_style3:hover::after {
			width: 0;
			background: rgba(0,160,234,1.00);}

/*4. 背景カラーが上下に分かれていく*/
.btn_style4 {
	position: relative;
	z-index: 2;
	background: rgba(0,160,234,1.00);}
	.btn_style4:hover {
		text-decoration: none;}
		.btn_style4::before,
		.btn_style4::after {
			left: 0;
			width: 100%;
			height: 50%;
			background: #000;}
		.btn_style4::before {
			top: 0;}
		.btn_style4::after {
			bottom: 0;}
		.btn_style4:hover::before,
		.btn_style4:hover::after {
			height: 0;
			background: rgba(0,160,234,1.00);}

/* 5. 上から背景がスライドして表示 */
.btn_style5 {
	position: relative;
	z-index: 2;
	overflow: hidden; }
	.btn_style5:hover { color: #fff; }
	.btn_style5::after {
		top: -100%;
		left: 0;
		width: 100%;
		height: 100%;}
	.btn_style5:hover::after {
		top: 0;
		background: rgba(0,160,234,1.00); }

/* 6. 左から背景がスライドして表示 */
.btn_style6 {
	position: relative;
	z-index: 2;
	overflow: hidden;}
	.btn_style6:hover {
		text-decoration: none;}
		.btn_style6::after {
			top: 0;
			left: -100%;
			width: 100%;
			height: 100%;}
		.btn_style6:hover::after {
			top: 0;
			left: 0;
			background: rgba(0,160,234,1.00); }

/* 7. 右から背景がスライドして表示 */
.btn_style7 {
	position: relative;
	z-index: 2;
	overflow: hidden;}
	.btn_style7:hover {
		text-decoration: none;}
		.btn_style7::after {
			top: 0;
			right: -100%;
			width: 100%;
			height: 100%;}
		.btn_style7:hover::after {
			top: 0;
			right: 0;
			background: rgba(0,160,234,1.00);}

/* 8. 上からパタッと要素が落ちてくる*/
.btn_style8 {
	position: relative;
	z-index: 2;
	-webkit-perspective: 300px;
	perspective: 300px;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	background: none;}
	.btn_style8:hover {
		color: #fff !important;
		text-decoration: none;}
	.btn_style8::after {
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,160,234,1.00);
		-webkit-transform-origin: center top;
		transform-origin: center top;
		-webkit-transform: rotateX(90deg);
		transform: rotateX(90deg);
		opacity: 0;}
		.btn_style8:hover::after {
			-webkit-transform: rotateX(0);
			transform: rotateX(0);
			opacity: 1;}

/* 矢印 */
.arrow {
    display: block;
    width: 10px;
    height: 10px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg); }

	/* 上向き矢印 */
	.arrow_top {
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);}
	/* 右向き矢印 */
	.arrow_right {
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);}
	/* 下向き矢印 */
	.arrow_bottom {
		-webkit-transform: rotate(135deg);
		transform: rotate(135deg);}
	/* 左向き矢印 */
	.arrow_left {
		-webkit-transform: rotate(-135deg);
		transform: rotate(-135deg);}

/*角丸*/	
.maru {
	border-radius: 10px; 
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px; }

/*ボックスシャドウ*/	
.boxshadow {
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;}

/*上付き文字*/	
.sup {
	font-size: 80%;
	vertical-align: super;}

/* リボン */
.ribbon {
    display: inline-block;
    position: absolute;
    bottom: 20px;
    box-sizing: border-box;
    padding: 10px 10px 10px 20px;
    margin: 0 0 0 -20px;
    font-weight: 600;
    color: #fff; }

.ribbon:before {
    position: absolute;
    content: '';
    top: 100%;
    left: 0;
    border: none;
    border-bottom: solid 15px transparent; }

    .r_cyan{ background: rgba(0,160,234,1.00) ;}
    .r_cyan:before{ border-right: solid 20px #6eb3e0;}
    .r_orenge{ background: #FF7400; }
    .r_orenge:before{ border-right: solid 20px #FB9D4F;}
    .r_green{ background: #4db33d; }
    .r_green:before{ border-right: solid 20px #7DA776;}
    .r_pink{ background: #EB61BE; }
    .r_pink:before{ border-right: solid 20px #F9A7FF;}

/* ボックス */
.b80{ width: 80%!important;}	
.b70{ width: 70%!important;}	
.b60{ width: 60%!important;}	
.b50{ width: 50%!important;}	
.b40{ width: 40%!important;}	
.b33{ width: 33.33333%;}
.b30{ width: 30%!important;}	
.b25{ width: 25%;}
.b20{ width: 20%!important;}	
	
/*画像フロート*/
.c_fix{	overflow: hidden;}

/* 影 */
.shadow{ text-shadow: 0px 2px 3px #666; }
	
.img_left{
	float: left;
	margin: 0px 25px 25px 0px !important;}
.img_right{
	float: right;
	margin: 0px 0px 25px 25px !important;}

/* 背景色交互 */
.bg_between_even .contents:nth-child(even) { background: rgba(219,243,255,0.70); } /* 偶数 */
	.bg_between_even .contents_inner{ padding: 50px 0; }
.bg_between_odd .contents:nth-child(odd) { background: rgba(219,243,255,0.70); } /* 奇数 */
	.bg_between_odd .contents_inner{ padding: 50px 0; }

/* flex box*/
.flex{
	display: -webkit-box !important;
    display: -ms-flexbox !important;
    display:flex !important;
	-webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row; }

.flexr{
	display: -webkit-box !important;
    display: -ms-flexbox !important;
    display:flex !important;
	-webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse; }
	.flex_item_center{
		-webkit-align-items: center; align-items: center; }
	.flex_item_bottom{
		-webkit-align-items: baseline; align-items: baseline; }

/* フレックスボックス */
.f80{ flex-basis: 80%!important;}
.f70{ flex-basis: 70%!important;}	
.f60{ flex-basis: 60%!important;}	
.f50{ flex-basis: 50%!important;}	
.f40{ flex-basis: 40%!important;}	
.f33{ flex-basis: 33.33333%;}
.f30{ flex-basis: 30%!important;}	
.f25{ flex-basis: 25%;}
.f20{ flex-basis: 20%;}

/* フレックスボックスリスト */
.flex_box2,.flex_box3,.flex_box4,.flex_box6{
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display:flex !important;
	-webkit-justify-content: space-between; /* Safari etc. */
    -ms-justify-content: space-between; /* IE10 */
	justify-content: space-between;
	-webkit-flex-wrap : nowrap; /* Safari etc. */
	-ms-flex-wrap : nowrap; /* IE10 */
	flex-wrap: wrap; }

	/* フレックスボックスリスト２列 */
	.flex_box2 li{ flex-basis: 48%; }
	.flex_box3 li{ flex-basis: 32%; }
	.flex_box4 li{ flex-basis: 23%; }
    .flex_box6 li{ flex-basis: 16%; }

/* flex between */
fbetween{ justify-content: space-between; }
	/* 偶数番のみ逆向き */
	.freverse_even:nth-child(even) { flex-direction: row-reverse; }
	/* 奇数番のみ逆向き */
	.freverse_odd:nth-child(odd) { flex-direction: row-reverse; }

/* photoフレックスボックスリスト */
.photo_flex2,.photo_flex3,.photo_flex4,.photo_flex6{
	display: -webkit-box !important;
    display: -ms-flexbox !important;
    display:flex !important;
	-webkit-justify-content: normal; /* Safari etc. */
    -ms-justify-content: normal; /* IE10 */
	justify-content: normal;
	-webkit-flex-wrap : nowrap; /* Safari etc. */
	-ms-flex-wrap : nowrap; /* IE10 */
	flex-wrap: wrap; }

	/* photo flex2 */
	.photo_flex2 li{ flex-basis: 50%; }
	.photo_flex3 li{ flex-basis: 33.3333%; }
	.photo_flex4 li{ flex-basis: 25%; }
    .photo_flex6 li{ flex-basis: 16%; }

/* ボックスリスト１横並び*/
.box_list1{}
	.box_list1 li{
		padding: 10px;
		overflow: hidden;}
	.box_list1 li::before{ border: none !important; }
	.box_list1 li .img{
		float: left;
		width: 20%;
		margin-right: 40px;}
	.box_list1 li .txt_area{
		overflow: hidden;}
		.box_list1 li .inner{
			margin-bottom: 20px;}

/* ボックスリスト2列 */
.box_list2,
.box_list2_1{ overflow: hidden; }
		.box_list1 ul{ border-top: none !important; }
		.box_list2 ul li::before{ border: none !important; }
		.box_list2 li,
		.box_list2_1 li{
			float: left;
			width: 50%;
			padding: 10px;
			border-bottom:none!important;}
		.box_list2 li:nth-child(2n+1),
		.box_list2_1 li:nth-child(2n+1) {
			clear: both; }  /*2つごとフロート解除*/ 
		.box_list2 li .img,
		.box_list2_1 li .img{
			margin-bottom: 15px;}

/* ボックスリスト3列 */
.box_list3{ overflow: hidden; }
		.box_list3 li{
			float: left;
			width: 33.3333%;
			padding: 10px;}
		.box_list3 li:nth-child(3n+1) {
			clear: both; }  /*3つごとフロート解除*/ 
		.box_list3 li .img{
			margin-bottom: 10px;}

/* ボックスリスト4列 */
.box_list4{ overflow: hidden; }
		.box_list4 li{
			float: left;
			width: 25%;
			padding: 10px;}
		.box_list4 li:nth-child(4n+1) {
			clear: both; }  /*4つごとフロート解除*/ 
		.box_list4 li .img{
			margin-bottom: 10px;}

/* ボックスリスト6列 */
.box_list6{ overflow: hidden; }
		.box_list6 li{
			float: left;
			width: 16.5%;
			padding: 10px;}
		.box_list6 li:nth-child(6n+1) {
			clear: both; }  /*6つごとフロート解除*/ 
		.box_list6 li .img{
			margin-bottom: 10px;}

/* margin */
.m10{	margin:10px; }
.m20{	margin:20px; }

/* padding */
.p10{	padding:10px; }
.p20{	padding:20px; }

/* Google Map */
.map{
	overflow:hidden;
	margin:auto;}
	.map iframe{
		width:100%!important;}

/* スマホ表示 */	
@media only screen and (max-width: 736px) {
/* iOS デフォルトスタイル リセット */
input[type="submit"],
input[type="button"],
input[type="text"]{
	-webkit-appearance: none !important; }
	
.pc_only{ display: none; }
.b80,.b70,.b60,.b50,.b40,.b33,.b30,.b25,.b20{ width: 100%!important; }
.b25{ width:50% !important; }
	
/* フレックスボックス */
.f80,.f70,.f60,.f50,.f40,.f33,.f30,.f25,f20{	flex-basis: 100% !important; }
	
/*画像フロート*/
.img_left{
	float: none;
	margin: 0px 0px 10px 0px !important;}
.img_right{
	float: none;
	margin: 0px 0px 10px 0px !important;}	

	/* 背景色交互 */
.bg_between_even .contents_inner,
.bg_between_odd .contents_inner{ padding: 35px 25px; } /* 奇数 */
	
/* flex box*/
.flex{ display: block !important; }
.flexr{ display: block !important;  }
	
/* flex boxlist */
.flex_box2 li,.flex_box3 li{ flex-basis: 100%; }
.flex_box4 li,.flex_box6{ flex-basis: 48%; }

/* photo flex2 */
.photo_flex2 li,
.photo_flex3 li,
.photo_flex4 li,
.photo_flex6 li{ flex-basis: 100%; }
	
/* ボックスリスト*/
.box_list1 li .img{
	float: none;
	width: 100% !important;
	margin: 0 0 20px;}
.box_list2 li,
.box_list3 li{
	float: none;
	width: 100% !important;}
.box_list4 li,
.box_list6 li{
	width: 50%;}
	

	}
