@charset "UTF-8";
/* CSS Document */

html{ height: 100%; } 
body,td,th { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 12pt; color: #3f3f3f; }
body { background-color: #FFF; height: 100%; }

a:link { color: #0097bc; }
a:visited { color: #0097bc; }
a:hover { color: #333333; }

/* ===== clearfix ===== */
.clearfix:after { content:"."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
/*ﾂ･*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/**/

#wrapper { height: 100%; position: relative; }
#wrapper #container { width: 960px; margin: 0 auto; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 12pt; color: #3f3f3f; }
#wrapper #container #header {  }
#wrapper #container #header h1 { font-size: 70%; font-weight: none; text-align: right; margin-top: 3px; }
#wrapper #container #header #header-logo { width: 200px; height: 45px; float: left; }
#wrapper #container #header .header-menu { width: 512px; float: right; }
#wrapper #container #header .header-menu li { width: 121px; float: left; margin: 10px 0 0 7px; }

#wrapper #container #header #header-nav { background: #0097bc; margin-top: 10px; z-index: 10000; }
/* ===== drop menu ===== */
#wrapper #container #header #dropmenu{ list-style-type: none; width: 960px; height: 50px; padding: 0; }
#wrapper #container #header #dropmenu li{ position: relative; width: 320px; float: left; margin: 0; padding: 0; text-align: center; }
#wrapper #container #header #dropmenu li a{ display: block; }
#wrapper #container #header #dropmenu li ul{ list-style: none; position: absolute; z-index: 10000; }
#wrapper #container #header #dropmenu li:last-child ul{  }
#wrapper #container #header #dropmenu li ul li{ overflow: hidden; width: 320px; height: 0; -moz-transition: .2s; -webkit-transition: .2s; -o-transition: .2s; -ms-transition: .2s; transition: .2s; }
#wrapper #container #header #dropmenu li ul li a{ background: #0097bc; }
#wrapper #container #header #dropmenu li:hover > a{ background: #0097bc; }
#wrapper #container #header #dropmenu > li:hover > a{  }
#wrapper #container #header #dropmenu li:hover ul li{ overflow: visible; height: 30px; }
#wrapper #container #header #dropmenu li:hover ul li:first-child{ border-top: 0; }
#wrapper #container #header #dropmenu li:hover ul li:last-child{ border-bottom: 0; }
#wrapper #container #header #dropmenu li:hover ul li:last-child a{ border-radius: 0 0 3px 3px; }

#wrapper #container .page-top { text-align: right; }

#wrapper #footer { background: #0097bc; margin-top: 15px; absolute: relative; bottom: 0px; }
#wrapper #footer .footer-info { border-bottom: solid 1px #FFFFFF; }
#wrapper #footer .footer-info .footer-tel { width: 480px; float: left; }
#wrapper #footer .footer-info .footer-inq { width: 480px; float: left; }
#wrapper #footer .footer-contents { width: 960px; margin: 0 auto; }
#wrapper #footer .footer-contents a:link { color: #ffffff; }
#wrapper #footer .footer-contents a:visited { color: #ffffff; }
#wrapper #footer .footer-contents a:hover { color: #333333; }
#wrapper #footer .footer-contents .footer-link { width: 220px; float: left; padding: 30px 0; }
#wrapper #footer .footer-contents .footer-link li { margin-bottom: 5px; }
#wrapper #footer .footer-contents .footer-link li ul li { margin: 10px 0 5px 15px; }
#wrapper #footer .copyright { text-align: center; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 60%; color: #FFFFFF; letter-spacing: 2px; padding: 20px 0; }


#wrapper #container #contents { /*min-height: 800px;*/ margin: 20px 0 10px 0; }
#wrapper #container #contents .slide-img { width: 638px; float: left; }
#wrapper #container #contents .slide-nav { width: 311px; float: right; }
#wrapper #container #contents .slide-nav li { margin-bottom: 15px; text-indent: -999px; }

#wrapper #container #contents .main { width: 720px; float: left; }
#wrapper #container #contents .main h2 { background: url(../img/h2_bar.png) bottom no-repeat; padding-bottom: 10px;margin-bottom: 15px; }
#wrapper #container #contents .main h3 { background: #0097bc; color: #FFFFFF; padding: 10px; }
#wrapper #container #contents .main h4 { margin-bottom: 15px; }
#wrapper #container #contents .main .text10 { font-size: 90%; color: #4a4a4a; line-height: 140%; }
#wrapper #container #contents .main .cap01 { font-size: 80%; color: #4a4a4a; margin: 0 0 80px 10px; line-height: 160%; }
#wrapper #container #contents .main .cap01 img { float: left; margin-right: 10px; }
#wrapper #container #contents .main .cap02 { font-size: 80%; color: #4a4a4a; margin: 0 0 20px 10px; line-height: 160%; }
#wrapper #container #contents .main .cap03 { font-size: 80%; color: #FFFFFF; margin: 0 0 40px 10px; line-height: 160%; background: #aaa; padding: 2px; }
#wrapper #container #contents .main .detail { border: solid 1px #0097bc; padding: 15px; margin-bottom: 30px; }
#wrapper #container #contents .main .detail .number { font-size: 80%; }
#wrapper #container #contents .main .detail .number li { margin-bottom: 10px; }
#wrapper #container #contents .main .detail .number img { margin: 5px 5px 0 0;}
#wrapper #container #contents .right_banner { width: 230px; float: right; }
#wrapper #container #contents .right_banner ul { margin-bottom: 10px; }
#wrapper #container #contents .right_banner ul li { margin-bottom: 5px; }

#wrapper #container #contents .main .top-security01 { width: 230px; height: 54px; float: left; background: url(../img/top_security_bg01.jpg) no-repeat; padding: 135px 0 0 5px; }
#wrapper #container #contents .main .top-security02 { width: 230px; height: 54px; float: left; background: url(../img/top_security_bg02.jpg) no-repeat; padding: 135px 0 0 5px; }
#wrapper #container #contents .main .top-security03 { width: 230px; height: 54px; float: left; background: url(../img/top_security_bg03.jpg) no-repeat; padding: 135px 0 0 5px; }
#wrapper #container #contents .main .mr10 { margin-right: 7px; }
#wrapper #container h3 { background: #0097bc; color: #FFFFFF; padding: 10px; }
#wrapper #container .detail { border: solid 1px #0097bc; padding: 15px; margin-bottom: 30px; }
#wrapper #container .detail2 { /*border: solid 1px #0097bc; padding: 15px;*/ margin-bottom: 30px; }
#wrapper #container .detail .company-logo li { float: left; }
#wrapper #container .detail2 .topics_text { font-size: 80%; }
#wrapper #container .detail2 .topics_text li { padding-top: 10px; margin-bottom: 10px; }
#wrapper #container .detail2 .topics_text img { margin-bottom: -6px; margin-right: 5px; }

#wrapper #container .detail .history { font-size: 80%; }
#wrapper #container .detail .history th,td { padding: 5px; text-align: left; line-height: 160%; }
#wrapper #container .detail .history th { background: #aaa; color: #FFF; border-bottom: solid 1px #FFF; }
#wrapper #container .detail .history td { border-bottom: dotted 1px #AAA; padding: 5px; line-height: 160%; }
#wrapper #container .detail .history td strong { color: #0097bb; font-weight: bold; }

#wrapper #container .detail .case_btn li { width: 100px; float: left; margin: 0 10px 10px 0; }
#wrapper #container .detail .case_box { border-bottom: solid 1px #AAA; padding: 10px 0; }
#wrapper #container .detail .case_logo { width: 150px; float: left; }
#wrapper #container .detail .case_detail { width: 500px; float: left; margin-left: 20px; }
#wrapper #container .detail .case_name { font-weight: bold; font-size: 90%; border-bottom: dotted 1px #AAA; padding: 5px 0; }
#wrapper #container .detail .case_area { float: right; padding: 3px; background: #AAA; color: #FFF; }
#wrapper #container .detail .case_descrption { font-size: 80%; padding-top: 10px; line-height: 140%; }
#wrapper #container .detail .case_detail_btn { font-size: 80%; text-align: right; }



.floatleft { float: left; }
.floatright { float: right; }
.mb30 { margin-bottom: 30px; }
.mb50 { margin-bottom: 50px; }
.imgCenter { text-align: center; margin: 30px 0; }