/*
	99Lime.com HTML KickStart by Joshua Gatcke
	style.css
bg
*/

/*---------------------------------
	IMPORTS
-----------------------------------*/

/*---------------------------------
	OVERRIDES
-----------------------------------*/
*{
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
}
a{color:#fff;outline:0;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
	text-decoration: none;
}
a:active{color:#fff;}
a:visited{color:#fff;}
a:hover{color:#ff6;}
a img{border:0;}
a [class^="icon-"]{color:inherit;text-decoration:none;}
strong,b{color:#fff; font-weight:bold;}
strike{}
em,i{}
.hide{display:none;}
.show{display:block;}
.abc{
    overflow:hidden;
}
a img {
  transition: 0.5s;
}
a img:hover {
  opacity: 0.6;
  transition: 0.5s;
}

.question{
      font-size:100%;
}

.pmark{
    width:25vh;
    padding:2vh;
}


/*---------------------------------
	text code and div
-----------------------------------*/
#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #000;
  z-index: 1;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #fff;
  z-index: 2;
}

.st{
    font-size:140%;
    line-height:140%;
}

.vcenter{
	vertical-align: middle;
}

.blue{
    color:#005566;
}

.bgyellow {
 	background-color:#eeee19;
  	color: #333;
   	padding:0.2% 0.5%;
	margin:0.2% 0.5%;
	}
.bgyellow2{
	background-color:#eeee19;
}
.bgblue {
 	background-color:#13708f;
	}
.bggray {
 	background-color:#adcbdc;
	}
.bgp {
 	background-color:#FC726F;
	}

.bgb{
    background-color: #1f5699;
    color: #eee;
    padding: 1.5vw 0;
    }

.bgb2{
    background-color: #2164b6;
    color: #fff;
    padding: 1.5vw 0;
    }

}

.navy{
	color: #1f5699;
}

.pink{
    color:#f36;
}
.bgwhite{
    background-color:#fff;
}
.point img{
	padding:30px;
	text-align:center;
}

.hpoint img{
	padding-top:calc(0% + 10vw);
    padding-bottom:calc(0% + 2vw);
	text-align:center;
}


.bgwhite p{
	padding:0 30px 30px 30px;
}

.white{
    color:#fff;
}

.catch{
	padding:0 0 10vw 0;
}

.effect img {
  transition: .6s;
}

.effect div {
  margin: auto;
  transition: .6s;
  transition-delay: .5s;
}

.voice{
    padding: 2vw;
}

.flow_head{
	background-color:#fff;
	padding:5vw;
	text-align:center;
}

.flow_01{
	background: url("img/flow_01bg.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}
.flow_01 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.flow_02{
	background: url("img/flow_02bg.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}
.flow_02 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.flow_03{
	background: url("img/flow_03bg.png") 0 0 no-repeat;
    background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}
.flow_03 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.flow_04{
	background: url("img/flow_04bg.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}
.flow_04 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.flow_05{
	background: url("img/flow_05bg.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}

.flow_05 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.flow_06{
	background: url("img/flow_06bg.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}

.flow_06 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.flow_07{
	background: url("img/flow_07bg.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}

.flow_07 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.flow_08{
	background: url("img/flow_08bg.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}

.flow_08 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.flow_09{
	background: url("img/flow_09bg.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:5vw;
	color:#fff;
    background-size: cover;
}

.flow_09 p{
	padding:2vw 0 0 0;
	color:#fff;
}

.monitor_01{
	background: url("img/monitor_01.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:10vw 5vw;
	color:#fff;
    background-size: cover;
}
.monitor_01 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.monitor_02{
	background: url("img/monitor_02.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:10vw 5vw;
	color:#fff;
    background-size: cover;
}
.monitor_02 p{
	padding:2vw 0 0 0;
	color:#fff;
}
.monitor_03{
	background: url("img/monitor_03.png") 0 0 no-repeat;
	background-color:#bbb;
	padding:10vw 5vw;
	color:#fff;
    background-size: cover;
}
.monitor_03 p{
	padding:2vw 0 0 0;
	color:#fff;
}


.setsumeikai{
	background: url("img/setsumeikai_bg.png") 0 0 no-repeat;
    padding: calc(0% + 10vw);
}

.bgg {
 	background-color:#41bfb1;
	}
.bgw{
   	background-color:#fff;
}

.green{
	color:#009999;
}
.topmenu{
    background-color:#1c66a5;
    padding:0.2vw;
}
.topmenu a{
	color: #fff;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
	text-decoration: none;
    margin: 0.2vw;
}

.topmenu a:hover {
	color:  #ffffcc;
	*text-decoration: underline;
}

.logo{
    fill:#fff;
    width:30%;
    height:100%;
}

.topmenu ul{
    margin:0;
    padding:0;
}
.topmenu li{
    display:inline;
  	list-style:none;
    padding:0.2vw 0.5vw;
    margin:0.5vw;
    font-style:normal;
	font-size:calc(50%+1vw);
    border-bottom: solid #ffffcc 2px;
}

.topmenu span{
    display:inline;
    color:#fff;
}

.topmenu object{
    width: calc(0% + 15vw);
}

.text1{
	width: 100％;
    	height:auto;
    	padding-top:5%;
    	padding-bottom:5%;
    	background-color:#009999;
    	box-sizing:border-box;
	}

.text2{ 
    	padding:5%;
    	margin:5% auto 5% auto;
	width: 70％;
    	background-color:#fff;
    	box-sizing:border-box;
	}

.text3{
	width: 100％;
    	height:auto;
    	padding-top:5%;
    	padding-bottom:5%;
    	background-color:#fff;
    	box-sizing:border-box;
	}

.text4{ 
    	padding:5%;
    	margin:5% auto 5% auto;
	width: 80％;
    	background-color:#fff;
    	box-sizing:border-box;
	}

.attention{
	font-size:70%;
	line-height:120%;
}


.footer2{
        font-size:80%;
    	line-height:180%;
}

.footer{ 
    	padding:5%;
    	margin:5% auto 5% auto;
	width: 80％;
    	background-color:#afe1c8;
    	box-sizing:border-box;
	}

h1,h2,h3,h4,h5,h6{
font-weight:bold;
line-height:140%;
}

h1{
font-size:calc(95% + 1.5vw);
padding:0.5vw 0 0 0;
color:#eee;
}

h1 p{
    font-size:40%;
    padding:0;
    margin:0;
    line-height: 120%;
}

h2{
font-size:calc(100% + 1.5vw);
margin:0 0 0 0;
padding: 2vw 0 2vw 0;
}

.fukidashi {
	color: #19283C;
	position: relative;
	display: inline-block;
	padding: 0 15px;
	width: auto;
	min-width: 115px;
	height: 40px;
	line-height: 32px;
	text-align: center;
	background: #F6F6F6;
	border: 3px solid #19283C;
	z-index: 0;
}
.fukidashi:before {
	content: "";
	position: absolute;
	top: -8px; left: 50%;
	margin-left: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 9px 9px 9px;
	border-color: transparent transparent #F6F6F6 transparent;
	z-index: 0;
}
.fukidashi:after {
	content: "";
	position: absolute;
	top: -12px; left: 50%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #19283C transparent;
	z-index: -1;
}

.col12{
font-size:calc(100% + 1.5vw);
margin:0 0 0 0;
}


h3{
font-size:calc(100% + 1.3vw);
margin:1% 1% 1% 1%;
line-height:130%;
}

h4{
font-size:calc(100% + 1vw);
margin:1% 0 1% 0;
}

h5{
font-size:calc(100% + 0.8vw);
margin:1% 0 1% 0;
}

h6{
font-size:calc(100% + 0.5vw);
margin:1% 0 1% 0;
}

thead th,
tbody th{
}

button,
a.btn,
input[type="submit"],
input[type="reset"],
input[type="button"]{
}

.menu{
}

blockquote{
}

.cvbtn{
  display: inline-block;
  padding: 1.5vw;
  margin: 1vw 0;
  border: solid 2px #fff;
  border-radius: 3px;
  background: rgba(255,255,255,255,80);
  color: #fff;
  font-size: calc(80% + 2vw);
  font-weight: bold;
  font-family: Helvetica, Arial, sans-serif;
}
.cvbtn:visited{color:#fff;}
.cvbtn:hover{
  border: solid 2px #eab73d;
  background: #eab73d;
  color: #fff;
}

.cvbtn_menu{
  display: inline-block;
  padding: 0.5vw;
  margin: 0;
  border: solid 2px #fff;
  border-radius: 3px;
  background: rgba(255,255,255,255,80);
  color: #fff;
  *font-size: calc(80% + 1vw);
  font-weight: bold;
  font-family: Helvetica, Arial, sans-serif;
}
.cvbtn_menu:visited{color:#fff;}
.cvbtn_menu:hover{
  border: solid 2px #fff;
  background: #eab73d;
  color: #fff;
}

.cvbtn_head{
  display: inline-block;
  padding: 1.5vw;
  margin: 1vw 0;
  border: solid 2px #555;
  border-radius: 3px;
  background: rgba(255,255,255,255,80);
  color: #555;
  font-size: calc(50% + 2vw);
  font-weight: bold;
  font-family: Helvetica, Arial, sans-serif;
}
.cvbtn_head:visited{color:#555;}
.cvbtn_head:hover{
  border: solid 2px #eab73d;
  background: #eab73d;
  color: #fff;
}


ul.breadcrumb{
	font-size:80%;
    }
ul.breadcrumb li {
	display:inline;
	list-style:none;
}

.breadcrumb h1{
	font-size:120%;
    	display:inline;
    	margin:0;
}

.header{
        background: url("img/header.png") right no-repeat;
        background-color:#f6f8f7;
        padding:0 0 30% 0;
        max-height: 800px;
        background-size: contain;
}

.header-text{
        height:51.7%;
        text-align: left;
        top:0; left:0; right:0; bottom:0;
        padding: 1% 0 0 0;
        padding-left: calc(0% + 5vw);
        font-size: calc(2vw);
        color: #005566;
}

.header-title{
	width:calc(50% + 3vw);
    min-width:240px;
	padding-top:10%;
}

.bgcatch{
        background: url("img/catch_bg.png") 0 0 no-repeat;
        background-color:#f4f4f4;
        padding:0 0 10vh 0;
        background-size: contain;
}


.bgcatch-text{
        text-align: center;
        font-size: calc(3vw);
        padding:0 0 3vw 0;
        color: #005566;
}

img .bgcatch-text{
	width: 50%;
}

img .point-head{
    padding:5vw 0 5vw 0;
}

.flowbg{
    *background: url("img/flowbg.png") repeat;
    background-color:#fafafa;
}


.flow{
    padding-top:0;
}

@media only screen and (max-width: 980px) {  
.flow img {  
    display: none;
  }  
  
.flow {  
  background: url("img/spflow.png") no-repeat center; 
  padding-top: calc(1710 / 510 * 100%) ;
  background-size: contain;
} 
}

.bgf{
    background-color: #eeeeee;
}


.center{
    text-align:center;
}
/*---------------------------------
	LAYOUT
-----------------------------------*/
body{
margin:0;
padding:0 0 0 0;
color:#666;
background-color:#ffffff;
font:bold calc(100% + 0.35vw) 'Arimo', arial, verdana, sans-serif;
text-shadow: 0 0 1px transparent; /* google font pixelation fix */
width:auto;
    line-height: 4vh ;
}

@media all and (-ms-high-contrast:none){
  body {
    font:bold calc(100% + 1.35vw) 'Arimo', arial, verdana, sans-serif;
  }
}



#01{
    background-color:#41bfb1;
    padding:3% 0 3% 0;
}

#02{
    background-color:#fff;
    padding:3% 0 3% 0;
}

#03{
    background-color:#41bfb1;
    padding:3% 0 3% 0;
}

#04{
    background-color:#fff;
    padding:3% 0 3% 0;
}

#05{
    background-color:#41bfb1;
    padding:3% 0 3% 0;
}

.wrap{
width:100%;
*padding:3vh auto 3vh auto;
}


#footer{
text-align:center;
padding:20px;
margin:0;
border-top:1px solid #ddd;
color:#999;
font-size:0.8em;
text-shadow:0px 1px 1px #fff;
position: relative;
top:0;
left:0;
background:#fff;
}

	#link-top{
	display:none;
	}

/* NAV BAR*/
.navbar{
*position:fixed;
top:0;
left:0;
width: 100%;
*height:calc(30%+15vh);
background:ccc;
    *#ddce8e;
color:#333;
z-index:1000;
padding:0.5em 0.5em;
}

	.navbar #logo{
	*position:absolute;
	padding:0.5em 0.5em;
	font-size: 0.2vw;
    width:calc(3vw + 10%);
    min-width: 15vh;
	color:#efefef;
	text-decoration:none;
	}

	.navbar span{
	color:#86dc00;
	}

	.navbar ul{
	display:inline-block;
	margin:0;
	padding:0;
    font-size:calc(1.5vw);
	}

		.navbar li{
		margin:0;
		padding:0;
		list-style-type:0;
		display:inline-block;
		}

		.navbar li a{
		display:inline-block;
		color:#000;
		padding:0.5em 0.5em;
		text-decoration:none;
		line-height:100%;
		font-size: calc(3px+50%);
		}

		.navbar li a:visited{
		color:#000;
		}
		.navbar li a:hover{
		color:#ccc;
        background: #444;
        border:#444;
		}

.callout{
background:#4598ef;/*#86dc00;*/
padding:3em 0;
color:#fff;
box-shadow:inset 0 0 10px rgba(0,0,0,0.2);
text-align: center;
text-shadow:0px 1px 3px rgba(0,0,0,0.2);
display:block;
}
	.callout + div.grid{margin-top:50px;}
	 a.callout{cursor:pointer;}
	 .callout i.icon-4x{font-size:6em;}
	 .callout h4{margin-bottom:30px;}
	 .callout-top{margin:50px 0 0 0;}
	 .callout p{margin-bottom:0;}
	 .callout .button{margin-top:10px;}
	 .callout.green{background:#19ad0b;/*#86dc00;*/}

#mc_embed_signup{
padding:30px 0;
}

#ui-preview{
border:5px solid #ddd;
margin:30px 0;
display:block;
}


.inner {
    width: 980px;
    margin: 0 auto;
}
.inner:after {
    content: "";
    clear: both;
    display: block;
}
 
/* header */
#top-head {
    top: -100px;
    position: absolute;
    width: 100%;
    margin: 100px auto 0;
    padding: 30px 0 0;
    line-height: 1;
    z-index: 999;
}
#top-head a,
#top-head {
    color: #fff;
    text-decoration: none;
}
#top-head .inner {
    position: relative;
}
#top-head .logo {
    float: left;
    font-size: 36px;
}
#global-nav ul {
    list-style: none;
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 14px;
}
#global-nav ul li {
    float: left;
}
#global-nav ul li a {
    padding: 0 30px;
}
 
/* Fixed */
#top-head.fixed {
    margin-top: 0;
    top: 0;
    position: fixed;
    padding-top: 10px;
    height: 55px;
    background: #fff;
    background: rgba(255,255,255,.7);
    transition: top 0.65s ease-in;
    -webkit-transition: top 0.65s ease-in;
    -moz-transition: top 0.65s ease-in;
}
#top-head.fixed .logo {
    font-size: 24px;
    color: #333;
}
#top-head.fixed #global-nav ul li a {
    color: #333;
    padding: 0 20px;
}
 
/* Toggle Button */
#nav-toggle {
    display: none;
    position: absolute;
    right: 12px;
    top: 14px;
    width: 34px;
    height: 36px;
    cursor: pointer;
    z-index: 101;
}
#nav-toggle div {
    position: relative;
}
#nav-toggle span {
    display: block;
    position: absolute;
    height: 4px;
    width: 100%;
    background: #666;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {
    top: 0;
}
#nav-toggle span:nth-child(2) {
    top: 11px;
}
#nav-toggle span:nth-child(3) {
    top: 22px;
}
@media screen and (max-width: 640px) {
    #top-head,
    .inner {
        width: 100%;
        padding: 0;
    }
    #top-head {
        top: 0;
        position: fixed;
        margin-top: 0;
    }
    /* Fixed reset */
    #top-head.fixed {
        padding-top: 0;
        background: transparent;
    }
    #mobile-head {
        background: #fff;
        width: 100%;
        height: 56px;
        z-index: 999;
        position: relative;
    }
    #top-head.fixed .logo,
    #top-head .logo {
        position: absolute;
        left: 13px;
        top: 13px;
        color: #333;
        font-size: 26px;
    }
    #global-nav {
        position: absolute;
        /* 開いてないときは画面外に配置 */
        top: -500px;
        background: #333;
        width: 100%;
        text-align: center;
        padding: 10px 0;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
    #global-nav ul {
        list-style: none;
        position: static;
        right: 0;
        bottom: 0;
        font-size: 14px;
    }
    #global-nav ul li {
        float: none;
        position: static;
    }
    #top-head #global-nav ul li a,
    #top-head.fixed #global-nav ul li a {
        width: 100%;
        display: block;
        color: #fff;
        padding: 18px 0;
    }
    #nav-toggle {
        display: block;
    }
    /* #nav-toggle 切り替えアニメーション */
    .open #nav-toggle span:nth-child(1) {
        top: 11px;
        -webkit-transform: rotate(315deg);
        -moz-transform: rotate(315deg);
        transform: rotate(315deg);
    }
    .open #nav-toggle span:nth-child(2) {
        width: 0;
        left: 50%;
    }
    .open #nav-toggle span:nth-child(3) {
        top: 11px;
        -webkit-transform: rotate(-315deg);
        -moz-transform: rotate(-315deg);
        transform: rotate(-315deg);
    }
    /* #global-nav スライドアニメーション */
    .open #global-nav {
        /* #global-nav top + #mobile-head height */
        -moz-transform: translateY(556px);
        -webkit-transform: translateY(556px);
        transform: translateY(556px);
    }
}