@charset "utf-8";



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



		基本レイアウト用CSS

		

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



.sp{
     display:none;
     
     }
     
.pc{
     display:block;
     
     }     

@media screen and (max-width:768px){
     
.sp{
     display:block !important;
     
     }
     
.pc{
     display:none !important;
     
     }
          
}

/**************************************************************



	Header



***************************************************************/


#headerarea {
     
    background:url("../images_renew/img_header_bg.gif") repeat-x scroll center bottom;
    
    margin: 0;
    
    padding: 0;
    
    width: 100%;
}

#header {

	margin: 0 auto 2px auto;
     
     overflow:hidden;

	width: 1000px;
     
     background: url("../images/bg_header_o.jpg") no-repeat scroll 110px bottom !important;
    

}


#header-bar {

    background-color: #00a0b8;

    clear: both;

    height: 5px;

    width: 100%;

}

.header_top {
     
     overflow:hidden;
     
/*     margin-bottom:11px;*/
     
     float:right;

}

#headerlogo{

	text-align:right;

	margin: 0 auto;

	width: 1000px;

	padding-top:1px;

/*	padding-bottom:2px;*/

	zoom: 1;

}

#headerlogo li{
	display:inline;

	font-size:12px;

	color:#666666;

	white-space:nowrap;
     
     margin-right:4px;
     
     margin-top:1px;

	}


#header h1 {

	float: left;

	display: inline;
     
     padding-top:31px;

}

#header h1 img{

    width: 210px;
	
/*	width:283px;*/
     
     height:auto;

}


#header p.bnr-corporate {

	position: absolute;

	top: 11px;

	right: 0;

}


#searchField {
     
/*     margin-top:8px;

	position: absolute;

	right: 0;*/

	font-size: 75%;
     
     height:29px;

}



#searchField form input.text {

	margin: 0 4px 0 0;

	width: 185px;

	height: 27px;
     
     padding:1px 5px;

	vertical-align: top;
     
     border:none;
     
     background:url("../images_renew/bg_form.png");
     
     color:#a2a2a2;
     
     line-height:27px

}

#searchField form input.text:focus{
    
     color:#000;
     
}
     

#searchField form input[type="image"] {

	width: 29px;

	height: 30px;

}


.v_corp {

	padding: 13px 0 0  !important;
     
/*        float:right;
     
  width:1000px;
     
     position:relative;*/

}


.logo_shutoko{
     
     float:right;
     
     margin:2px 1px 0 0;
     
     vertical-align:bottom;
     
}


.sns{
     overflow:hidden;
     
     float:right;
     
     margin:11px 0 18px 0;
     
     /*追加*/
     clear:both;
     
}

.sns li{
     
     float:left;
     
     margin-left:2px;
     
}


.sns li img{
     
     width:24px;
     
     height:auto;
     
}

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

#header-bar {
    z-index:10000;
}

#header{
     
     margin-bottom:0;
     
     width:100%;
    
    background: none;
     }
    
#headerlogo{
    
    width: 100%;
    
    border-bottom: 1px solid #ececec;
    
    padding-bottom: 2px;
     }

#headerlogo li{
	display:inline;

	font-size:12px;

	color:#666666;

	white-space:nowrap;
     
     margin: 0;
    
  width: 100%;
    
  padding-left: 15px;
    
  padding-right: 15px;
    
	}
    
.header_top {
     
     margin-bottom:0;
     
     padding-bottom:10px;
     
     width:100%;
     
     float:none;
     
     border:1px solid #ececec;
     
     margin-top:10px;
     
     background:url("../images_renew/bg_footer.gif") repeat left top !important;
     
     position:relative;
     

}



#header h1 {

    padding: 10px 10px 10px 10px;

    z-index: 1000;

    height:30px;

}

#header h1 img{

    width:150px;
/*    width: 201.8px;*/

}

.v_corp {

	padding: 0 !important;
     
     width:100%;
     
     float:left;
     
}

#searchField{
     display:block;
 
     width:auto;
 
     position:relative;
 
     left:5px;
 
     top:0;
 
     margin-top:10px;
 
 }

#searchField form input.text {
     border:1px solid #ececec;

     border-radius:3px;

     width: 170px;

     background:#fff;

     -webkit-appearance : none;
    -webkit-tap-highlight-color : rgba(0,0,0,0);
}
          
#content .sns{
     float:none;

     overflow:hidden;

     margin:0 10px 25px 10px;

}

#header .sns{

     margin:0 3px 0 0;
     
     position:absolute;
     
     float:nnoe;
     
     right:0;
     
     top:20px;

}          

 #header .sns li{

     margin-right:2px;

}
          
 #header .sns li img{

     width:20px;

     height:20px;

}
              
.sns li{

     float:left;     

     margin-left:0;

     margin-right:5px;
     
}

.sns li img{
     
     width:40px;
     
     height:auto;
     
}

}

/****************************************************************



	Navigation



*****************************************************************/



#gNav{

	overflow: hidden;

	width: 100%;
     
     overflow:hidden;
     
     border-top:1px solid #ececec;
     
     border-bottom:1px solid #ececec;
     
     margin-bottom:19px;

}

#gNav ul {

	width:1000px;
     
     margin:0 auto;

}

#gNav li {

	float: left;
     
     height:49px;

}

#gNav li a{

	 text-indent:-9999px;
      
      display:block;
      
      background:url("../images_renew/pc_gnav.gif");
      
      height:49px;


}



#gNav li.nav01 a{width:167px; background-position:0 0 ;}
#gNav li.nav02 a{width:167px; background-position: -167px 0;}
#gNav li.nav03 a{width:167px; background-position: -334px 0;}
#gNav li.nav04 a{width:167px; background-position: -501px 0;}
#gNav li.nav05 a{width:166px; background-position: -668px 0;}
#gNav li.nav06 a{width:166px; background-position: -834px 0;}

.main_index #gNav li.nav01 a,
#gNav li.nav01 a:hover{width:167px; background-position:0 -50px;}
#gNav li.nav02 a:hover{width:167px; background-position: -167px -50px;}
#gNav li.nav03 a:hover{width:167px; background-position: -334px -50px;}
#gNav li.nav04 a:hover{width:167px; background-position: -501px -50px;}
#gNav li.nav05 a:hover{width:166px; background-position: -668px -50px;}
#gNav li.nav06 a:hover{width:166px; background-position: -834px -50px;}


.mail_mag #gNav li.nav06 a,
#gNav li.nav06 a:hover{width:166px; background-position: -834px -50px;}


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

#gNav{
     position: absolute;

     top:48px;

     right:0;

     z-index:1;

     font-size:100%;
     
     border:none;
    
    margin-bottom: 0;
     
/*     background:#fff;*/

}    

#gNav > a{
     
     width:50px;

     height:50px;
     
     top:0;

     border-left:1px solid #ececec;

     float:right;
     
     position:relative;
     
}

#gNav > a span {

    display: block;
    
    background: #00afc6;

    width: 20px;

    height: 4px;

    position: absolute;

    left: 15px;

    transition: all 0.6s;
    -webkit-transition: all 0.6s;
    -moz-transition: all 0.6s;
}

#gNav > a span:first-child {
    top: 16px;
    
}

#gNav > a span:nth-child(2) {

    margin-top: -2px;

    top: 50%;

}

#gNav > a span:last-child {

    bottom: 16px;

}

#gNav > a.active span:first-child {
    -webkit-transform: translateY(7px) rotate(45deg);
    -moz-transform: translateY(7px) rotate(45deg);
    -ms-transform: translateY(7px) rotate(45deg);
    transform: translateY(7px) rotate(45deg);
}

#gNav > a.active span:nth-child(2) {
    opacity: 0;
}

#gNav > a.active span:last-child {
    -webkit-transform: translateY(-7px) rotate(-45deg);
    -moz-transform: translateY(-7px) rotate(-45deg);
    -ms-transform: translateY(-7px) rotate(-45deg);
    transform: translateY(-7px) rotate(-45deg);
}
 
#gNav ul{
      display: none;

      width:100%;

      margin-top:50px;

      background:#fff;

      z-index:100;
      
      border-top:1px solid #ececec;
      
      border-bottom:2px solid #ececec;
      
      font-size:122%;
      
      font-weight:bold   ;
      
}
      
#gNav ul li{

      width:auto;

      float:none;

      border-bottom:1px solid #ececec;

      height:auto;
      
      padding:0 10px;


}

#gNav ul li:last-child {
     
     border:none;
     
}  
      
#gNav ul li a{
      background:none;

     text-indent:0;
     
     height:auto;

     display:block;

     padding:15px 0 16px 35px;

     width:auto !important;
     
     color:#000;
     
     position:relative;

}

#gNav ul li span{
     
    height:5px;
    
    width:15px;

    position:absolute;

    top:20px;

    right:0;

    background:#000;

}      

#gNav ul li.nav01 span{ background:#00afc6;}
#gNav ul li.nav02 span{ background:#4770ca;}
#gNav ul li.nav03 span{ background:#e35a99;}
#gNav ul li.nav04 span{ background:#c59923;}
#gNav ul li.nav05 span{ background:#8f69d3;}
#gNav ul li.nav06 span{ background:#80B948;}
#gNav ul li.nav01 a{ background:url("../images_renew/icon_nav01.png")no-repeat 3px center !important;background-size:18px 17px !important;}
#gNav ul li.nav02 a{ background:url("../images_renew/icon_nav08.png")no-repeat 3px center !important;background-size:18px 18px !important;}
#gNav ul li.nav03 a{ background:url("../images_renew/icon_nav03.png")no-repeat 1px center !important;background-size:18px 19px !important;}
#gNav ul li.nav04 a{ background:url("../images_renew/icon_nav09.png")no-repeat 3px center !important;background-size:18px 19px !important;}
#gNav ul li.nav05 a{ background:url("../images_renew/icon_nav06.png")no-repeat 3px center !important;background-size:18px 16px !important;}
#gNav ul li.nav06 a{ background:url("../images_renew/icon_nav07.png")no-repeat 3px center !important;background-size:18px 18px !important;}               



}
/**************************************************************



	Content



***************************************************************/



#contentsarea {

	width: 1000px;

}





/* main

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

#main{}



#main p.skip a:link, #footer p.skip a:visited, #footer p.skip a:hover, #footer p.skip a:active {

	color: #0092b2;

	text-decoration: underline;

}




/**************************************************************



	Footer



***************************************************************/


#footer {

	margin: 0;
     
     background:url("../images_renew/bg_footer.gif") repeat left top;
     
     clear:both;
     
}

#footerMenu {
    background-color: #00a0b8;

    margin: 0;

    padding-bottom: 11px;

    padding-top: 11px;

    text-align: center;
    
    font-size: 75%;


}

ul#footerMenu li#end {
    border-right: medium none;
    
}

#footerMenu::after {
    clear: both;
    
    content: ".";

    display: block;

    font-size: 0;

    height: 0;

    visibility: hidden;

}

#footerMenu li {
    border-right: 1px solid #ffffff;

    color: #666666;

    display: inline;

    font-size: 12px;

    padding: 0 10px;

    white-space: nowrap;
    

}


ul#footerMenu li a,
ul#footerMenu li a:link,
ul#footerMenu li a:visited {
    color: #ffffff;

    text-decoration: none;

}

a.externalMark {
    background: rgba(0, 0, 0, 0) url("../images/ico_link_window_01.gif") no-repeat scroll right center;
    margin-right: 5px;
    padding-right: 15px;
}

a.externalMark.nega {
    background: url("../../common/images/ico_link_window_03.gif")  no-repeat scroll right center;
    
    margin-right: 5px;
     
    padding-right: 15px;

}


#footer p#copyright {

     text-align:center;
     
     padding: 10px 0;
     
     background: #fff;

    font-size: 75%;
}


@media screen and (max-width:768px){
#topbutton{
     
    display:inline-block;

    float:right;
    
    margin-top:-65px;
    
    margin-right:10px;
}

#footer ul#footerMenu{

	height:auto;

	overflow:hidden;

	}		

#footer ul#footerMenu li{

	padding:3px 10px 3px 10px;

	display:inline-block;

	border:none;

	}
     
#footer p#copyright {

     padding:0;

}


}