/* ============================================================
隕∫ｴ�
============================================================ */
h1, h2, h3, h4, h5, p, ul, ol, li, dl, dt, dd, blockquote, form, label {
margin: 0;
padding: 0;
}
img {
border:0;
vertical-align:bottom;
}
/* 繝ｪ繝ｳ繧ｯ
============================================================ */
a:link {
color: #0671cf;
text-decoration: underline;
}
a:visited {
color: #0671cf;
text-decoration: underline;
}
a:hover {
color: #2832ad;
text-decoration: none;
}
a:active {
color: #2832ad;
text-decoration: none;
}
/* ============================================================
豎守畑class
============================================================ */
.f_clear {
clear:both;
margin:0;
padding:0;
border:0;
height:0;
font-size:0;
line-height:0;
}
.l_clear {
clear:left;
margin:0;
padding:0;
border:0;
height:0;
font-size:0;
line-height:0;
}
.r_clear {
clear:right;
margin:0;
padding:0;
border:0;
height:0;
font-size:0;
line-height:0;
}
/* 蟇�○ */
.right {
text-align:right;
}
.center {
text-align:center;
}
/* */
.opa_chg:hover {
filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
opacity: 0.7;
}
.red {
color: red;
}
/* 蜈ｨ菴�
============================================================ */
body {
margin: 0;
padding: 0;
color: #030303;
font-family: "Meiryo", "HiraKakuProN-W3", "Hiragino Kaku Gothic ProN", "MotoyaLCedar", "Droid Sans Japanese", "MS Gothic", "sans-serif";
-webkit-text-size-adjust: 100%;
}
#wrap_header {
width: 100%;
text-align: left;
position: fixed;
top: 0px;
left: 0px;
z-index: 999;
background-color: rgba(255, 255, 255, 0.95);
background-position: top;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
#wrap_gNavi {
width: 100%;
height: 80px;
text-align: left;
position: fixed;
top: 90px;
left: 0px;
z-index: 998;
background-color: rgba(255, 255, 255, 0.95);
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
/*box-shadow: 0px 1px 8px rgba(0,0,0,0.15);*/
border-bottom: 1px solid #c2c2c2;
}
#wrap_pagehead {
margin-top: 170px; /* for fixed header */
width: 100%;
text-align: left;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
/*background-color: #1f5598;*/
border-bottom: 1px solid #c2c2c2;
}
#wrap_content {
width: 100%;
text-align: left;
padding-top: 30px;
padding-bottom: 30px;
background-color: transparent;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
#wrap_banner {
width: 100%;
text-align: left;
padding-top: 20px;
padding-bottom: 0px;
/*background-color: #cccccc;*/
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
background-image: url(../imgs/bg_banner.jpg);
background-position:center top;
}
@media screen and (max-width:960px) {
#wrap_gNavi {
height: 47px;
top: 60px;
}
#wrap_pagehead {
margin-top: 107px; /* for fixed header */
}
}
@media screen and (max-width:640px) {
#wrap_gNavi {
height: 42px;
top: 40px;
}
#wrap_content {
padding-top: 20px;
background-color: white;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
#wrap_banner {
padding-top: 20px;
background-color: white;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
#wrap_pagehead {
margin-top: 82px; /* for fixed header */
}
}
/* 繝倥ャ繝繝ｼ
============================================================ */
#header {
width: 1100px;
margin: 0 auto;
height: 90px;
position: relative;
}
#header h1,
#header h2 {
color: #555555;
font-size: 14px;
font-weight: normal;
width: 340px;
position: absolute;
top: 30px;
left: 200px;
text-align: center;
}
#header #logo {
position: absolute;
top: 20px;
left: 0px;
width: 150px;
}
#header #co_logo {
position: absolute;
top: 28px;
right: 30px;
width: 130px;
}
#header #inquiry_btn {
position: absolute;
top: 30px;
right: 20%;
background-color: #DB7647;
display: none;
width: 50px;
}
@media screen and (max-width:1118px) {
#header {
width: 100%;
}
#header #logo {
left: 10px;
}
}
@media screen and (max-width: 960px) {
#header {
height: 60px;
}
#header h1,
#header h2 {
top: 40px;
}
#header #logo {
top: 30px;
}
#header #co_logo {
top: 8px;
right: 20px;
}
}
@media screen and (max-width: 750px) {
#header h1,
#header h2 {
font-size: 13px;
position: static;
width: 100%;
text-align: center;
}
#header #co_logo {
width: 100px;
}
}
@media screen and (max-width: 640px) {
#header {
height: 40px;
}
#header #logo {
width: 130px;
top: 18px;
}
#header h1,
#header h2 {
display: none;
}
}
/* 繧ｰ繝ｭ繝ｼ繝舌Ν 繝翫ン繧ｲ繝ｼ繧ｷ繝ｧ繝ｳ
============================================================ */
#globalNavi {
width: 1100px;
height: 60px;
margin-top: 0px;
margin-left: auto; /*centering */
margin-right: auto;
position: relative;
padding: 0;
}
@media screen and (max-width:1118px) {
#globalNavi {
width: 100%;
}
}
@media screen and (max-width:960px) {
#globalNavi {
height: 40px;
}
}
@media screen and (max-width:640px) {
#globalNavi {
height: 40px;
}
}
#globalNavi #button {
display: none;
}
#globalNavi > ul {
width: 100%;
margin-top: 0;
list-style: none;
padding: 0;
text-align: center;
display: flex;
justify-content: center;
}
#globalNavi > ul > li {
/*
float: left;
display: block;
*/
display: inline-block;
text-align: center;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
border-left: 1px solid #c2c2c2;
padding: 0;
}
#globalNavi > ul > li#home_gn,
#globalNavi > ul > li#tajima_gn {
width: 125px;
}
#globalNavi > ul > li#wakamatsu_gn,
#globalNavi > ul > li#bange_gn {
width: 155px;
}
#globalNavi > ul > li#furukawa_gn,
#globalNavi > ul > li#contact_gn {
width: 170px;
}
#globalNavi > ul > li#aboutus_gn {
width: 140px;
border-right: 1px solid #c2c2c2;
}
#globalNavi > ul > li > a,
#globalNavi > ul > li > p {
font-size: 15px;
font-weight: normal;
color: #555555;
text-decoration: none;
display: block;
height: 60px;
line-height: 62px;
cursor: pointer;
margin: 0;
padding: 0;
}
#globalNavi > ul > li.act {
/*background-color: #4C77AC;*/
}
#globalNavi > ul > li.act > a,
#globalNavi > ul > li.act > p {
color: #c1272d;
}
#globalNavi > ul > li.pd > a,
#globalNavi > ul > li.pd > p {
color: white;
background-color: #3b6a9b;
background-color: #005d9e;
}
#globalNavi > ul > li > a:hover,
#globalNavi > ul > li > p:hover {
color: white;
background-color: #1f5598;
background-color: #5a85b9;
background-color: #df5e6d;
}
#globalNavi > ul > li.pd > a:hover,
#globalNavi > ul > li.pd > p:hover {
color: white;
background-color: #3b6a9b;
background-color: #005d9e;
}
@media screen and (max-width:1118px) {
#globalNavi > ul > li#home_gn,
#globalNavi > ul > li#tajima_gn {
width: 105px;
}
#globalNavi > ul > li#wakamatsu_gn,
#globalNavi > ul > li#bange_gn {
width: 135px;
}
#globalNavi > ul > li#furukawa_gn,
#globalNavi > ul > li#contact_gn {
width: 150px;
}
#globalNavi > ul > li#aboutus_gn {
width: 120px;
}
}
/***** 繧ｵ繝� *****/
@media screen and (max-width:960px) {
#globalNavi #button {
display: block;
text-align: right;
margin-right: 2%;
margin-top: -3px;
}
#globalNavi #button img {
cursor: pointer;
width: 100px;
}
#globalNavi > ul {
/*float: none;*/
display: none;
width: 100%;
/*height: auto;*/
margin-top: 0px;
position: absolute;
left: 0;
top: 51px; /* link to header height */
background-color: rgba(255,255,255, 0.92);
padding-bottom: 30px;
overflow: auto;
}
#globalNavi > ul > li {
/*float: none;*/
display: block;
height: auto;
text-align: left;
width: 65%;
padding-left: 5%;
margin-left: auto;
margin-right: auto;
border-bottom: 1px solid #C2C2C2;
border-left: none;
position: relative;
background-color: transparent;
}
#globalNavi > ul > li#home_gn,
#globalNavi > ul > li#tajima_gn {
width: 65%;
}
#globalNavi > ul > li#wakamatsu_gn,
#globalNavi > ul > li#bange_gn {
width: 65%;
}
#globalNavi > ul > li#furukawa_gn,
#globalNavi > ul > li#contact_gn {
width: 65%;
}
#globalNavi > ul > li#aboutus_gn {
width: 65%;
border-right: none;
}
#globalNavi > ul > li > a,
#globalNavi > ul > li > p {
width: 80%;
height: 54px;
line-height: 54px;
display: block;
text-align: center;
}
#globalNavi > ul > li > p span {
display: inline-block;
position: absolute;
right: 15%;
width: 26px;
height: 30px;
vertical-align: top;
background-image: url(../imgs/mark_Navi_down.png);
background-repeat: no-repeat;
background-position: right;
}
#globalNavi > ul > li.pd > p span {
background-image: url(../imgs/mark_Navi_up.png);
background-repeat: no-repeat;
background-position: right;
}
#globalNavi > ul > li.act {
border: none;
border-bottom: 1px solid #C2C2C2;
background-color: transparent;
}
#globalNavi > ul > li.act > a,
#globalNavi > ul > li.act > p {
padding-left: 0;
}
#globalNavi > ul > li.pd > a,
#globalNavi > ul > li.pd > p {
background-image: none;
background-color: transparent;
}
#globalNavi > ul > li > a:hover,
#globalNavi > ul > li > p:hover {
color: #3399FF;
background-image: none;
background-color: transparent;
}
#globalNavi > ul > li.pd > a:hover,
#globalNavi > ul > li.pd > p:hover {
color: #3399FF;
background-color: transparent;
}
}
@media screen and (max-width: 640px) {
#globalNavi #button {
margin-right: 2%;
margin-top: 0px;
}
#globalNavi #button img {
width: 80px;
}
#globalNavi >ul {
top: 43px;
}
#globalNavi > ul > li#home_gn,
#globalNavi > ul > li#tajima_gn {
width: 75%;
}
#globalNavi > ul > li#wakamatsu_gn,
#globalNavi > ul > li#bange_gn {
width: 75%;
}
#globalNavi > ul > li#furukawa_gn,
#globalNavi > ul > li#contact_gn {
width: 75%;
}
#globalNavi > ul > li#aboutus_gn {
width: 75%;
}
}
/* content
============================================================ */
#content {
width: 1100px;
margin-left: auto;
margin-right: auto;
position: relative;
background-color: transparent;
}
@media screen and (max-width:1118px) {
#content {
width: 100%;
/*overflow: hidden;*/
}
}
/* footer
============================================================ */
#footer {
width: 100%;
position: relative;
padding: 0;
background-color: #1f489d;
-webkit-transform: translate3d(0, 0, 1px);
transform: translate3d(0, 0, 1px);
}
#footer #inner {
position: relative;
margin: 0 auto;
width: 1100px;
height: 200px;
background-color: #1f489d;
}
#footer #inner #co_name {
width: 210px;
position: absolute;
top: 30px;
right: 60px;
}
#footer #inner p {
color: white;
line-height: 26px;
width: 270px;
position: absolute;
top: 66px;
right: 0;
}
@media screen and (max-width:1118px) {
#footer #inner {
width: 100%
}
#footer #inner #co_name {
right: 100px;
}
#footer #inner p {
right: 40px;
}
}
#footer #copyright {
color:#1f489d;
font-size: 15px;
width: 100%;
background-color: white;
text-align: center;
height: 60px;
line-height: 62px;
}
#footer #bottom {
width: 100%;
height: 30px;
background-color: #1f489d;
}
#pagetop {
position: fixed;
bottom: 104px;
right: 0px;
display: block;
opacity: 0;
z-index: 999;
-webkit-transform: translate3d(0, 0, 9px);
transform: translate3d(0, 0, 9px);
}