@charset "utf-8";
/* CSS Document */
/****************************************
		1. 基本設定 
*****************************************/

/*
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 3.3.0
build: 3167
　↓YUI3 CSS Reset　ブラウザー固有のスタイルをリセットします↓　*/
body,div,dl,dt,dd,
ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,code,form,fieldset,legend,
input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}

/*
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 3.3.0
build: 3167
↓YUI3 CSS Fonts　フォントサイズを相対指定する↓*/


/*---↓リンクに対する共通設定↓---*/
*{
	margin:0;
	padding:0;
	line-height:1.5;
	list-style:none;
}
/*アンダーtopボタン*/
.pagetop {
	position: fixed;
	bottom: -200px;
	right: 20px;
	z-index:9999;
}
.pagetop a {
	display: block;
	width: 86px;
	height: 110px;
}

img{
	border:none;
}
a, a:link,/*未訪問のリンクを指定*/
a:visited,/*訪問済みのリンクを指定*/
a:hover,/*マウスオーバーした時のリンク部分を指定*/
a:active,/*クリック時のリンク部分を指定*/
a{
	text-decoration:none;
}
body{	
	overflow-x:hidden;
}

/* clearfix
----------------------------------------------------*/
.clearfix{ /zoom: 1; }
.clearfix:after{ content: ''; display: block; clear: both; }
/* box-sizing
----------------------------------------------------*/
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
/*送信ボタン*/
input[type="submit"] {
  -webkit-appearance: none;
}
input[type="reset"] {
  -webkit-appearance: none;
}

.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }
/*----------------------------------------------------
	共通
----------------------------------------------------*/
/* スクロールバーの有無によるズレ対策 */
html{
	overflow-y: scroll;
    overflow-x: hidden;
	height:100%;
	-webkit-text-size-adjust: 100%;
}
.header_top{
	width:100%;
	height:5px;
	background:#0068b7;
}

header{
	width:100%;
	height:200px;
	background:#FFF;
	border-bottom:1px solid #f2f2f2;
}

.header_center{
	width:1100px;
	height:200px;
	position:relative;
	margin:0 auto;
	
}

.remonica{
	position:absolute;
	right:0;
	top:30px;
	width:220px;
	height:95px;
}
/*--------------- レインボウ -----------------------*/
#rainbow{
	position:absolute;
	top:20px;
	left:35.8%;
}


h1.logo{
	position:relative;
	top:25px;
	width:380px;
	height:96px;
	margin:0 auto;
}
span.s_logo{
	font-size:77%;
}
	
nav{
	width:1100px;
	height:20px;
	background:url(../img/nav_back.gif);
	position:absolute;
	bottom:20px;
}
ul.header_nav{
	width:1100px;
	height:20px;
	display:flex;

}

ul.header_nav > li{
	width: 183px;
	height:40px;
	text-align:center;
}

ul.header_nav li .drop_01{
	position:relative;
}

ul.header_nav > li > a{
	float:left;
	width:183px;
	height:20px;
	text-align:center;
	font-size:85%;
	color:#333;
	line-height:22px;
	text-decoration:none;
    position: relative;
    display: inline-block;
    transition: .3s;
	letter-spacing:2px;
}
ul.header_nav > li > a:hover{
	color:#1baad1;
}

.header_nav > li > a::before,
.header_nav > li > a::after {
  position: absolute;
  content: '';
  width: 0;
  height: 1px;
  background-color:#1baad1;
  transition: .3s;
}
.header_nav > li > a::before {
  top: -5px;
  left: 0;
}
.header_nav > li > a::after {
  bottom: -5px;
  right: 0;
}
.header_nav > li > a:hover::before,
.header_nav > li > a:hover::after {
  width: 100%;
  
}




#dropmenu li:hover > ul{
	display: block;
	list-style: none;
}

.nav_drop_ul{
	width: 183px;
	height: auto;
	display:none;
	list-style: none;
	position: absolute;
	top: 40px;
	left: 183px;
	background: rgba(255, 255, 255, 0.9);/*rgba(0,104,183,0.5)*/
	letter-spacing: 2px;
	border: solid 2px #0068b7;
	border-top: none;
	font-size: 65%;
	float: inherit;
	z-index: 20;
}

.nav_drop_ul li{
	padding: 10px;
	text-decoration: none;
	border-bottom:solid 1px #0068b7;
	color: #fff;
	letter-spacing: 2px;
}

.nav_drop_ul li a{
	color: #333;
}

.nav_drop_ul li:hover{
	background: #8FC8EB;/*rgba(0,104,183,0.5)*/
}

.nav_drop_ul li:last-of-type:hover{
}

.nav_drop_ul li:last-of-type{
	border-bottom: none;
}



/*-----------------------------------

		footer

-----------------------------------*/
footer{
	background: #0066cc;
	color: #fff;
}

.footer_contents{
	width: 1100px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 0 auto;
}

.footer_contents li{
	text-align: center;
}

.footer_contents > li:nth-child(3){
	padding-top: 40px;
}

.footer_contents > li:last-of-type{
	padding: 10px 0 60px;
}

.footer_nav{
	width: 1100px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-top: 40px;
	letter-spacing:2px;
	font-size:93%;
	
}

.footer_nav.second{
	padding-top: 5px;
}

.footer_nav li{
	padding: 2px;
}

.footer_nav li a{
	color: #fff;
}

.copy{
	background: #2855b3;
	text-align: center;
	font-size: 50%;
	padding: 5px 0;
}




/*------------------------------

		footer_anime

------------------------------*/

.footer_nav li{
    /*線の基点とするためrelativeを指定*/
  position: relative;
  margin:0 10px;
}

/*線の基点位置*/
.footer_nav	li::before,
.footer_nav li::after{
  content:"";
    /*絶対配置で線の位置を決める*/
  position: absolute;
    /*線の形状*/
  width: 0;
  height: 1px;
  background:#fff;
/*アニメーションの指定*/
  transition: all 0.2s linear;
  transition-delay: 0.2s;
}

.footer_nav li::before{
  right: 0;
  top: 0;
}
.footer_nav li::after{
  left: 0;
  bottom: 0;
}

/*現在地とhoverした際の線の変化*/

.footer_nav li.current::before,
.footer_nav li.current::after,
.footer_nav li:hover::before,
.footer_nav li:hover::after{
  width: 100%;/*横幅を100%に*/
}

.footer_nav li.current span::before,
.footer_nav li.current span::after,
.footer_nav li:hover span::before,
.footer_nav li:hover span::after{
  height: 100%;/*縦幅を100%に*/
}

.footer_nav li:hover{
	color: #fff;
	-webkit-text-shadow: -0.5px 0.5px 2px #FFF, 0.5px -0.5px 2px #FFF;
	-moz-text-shadow: -0.5px 0.5px 2px #FFF, 0.5px -0.5px 2px #FFF;
	-ms-text-shadow: -0.5px 0.5px 2px #FFF, 0.5px -0.5px 2px #FFF;	
    text-shadow: -0.5px 0.5px 2px #FFF, 0.5px -0.5px 2px #FFF;
	-moz-transition:all .3s;
	-ms-transition:all .3s;
	-webkit-transition:all .3s;
	transition:all .3s;
}

/*--------------------------------

		ページトップ

---------------------------------*/
#page-top a{
	display: flex;
	justify-content:center;
	align-items:center;
	background:#ff9900;
	border-radius: 5px;
	width: 60px;
	height: 60px;
	color: #fff;
	text-align: center;
	text-transform: uppercase; 
	text-decoration: none;
	font-size:0.6rem;
	transition:all 0.3s;
	letter-spacing: 1px;
}

#page-top a:hover{
	background: #2853b7;
}

/*リンクを右下に固定*/
#page-top {
	position: fixed;
	right: 40px;
	bottom: 40px;
	z-index: 2;
    /*はじめは非表示*/
	opacity: 0;
	transform: translateY(100px);
}

/*　上に上がる動き　*/

#page-top.UpMove{
	animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/*　下に下がる動き　*/

#page-top.DownMove{
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 1;
	transform: translateY(0);
  }
  to {
  	opacity: 1;
	transform: translateY(100px);
  }
}