/*Theme Name: iecon Version: 1.0*/

/**************************************************** standard elements */
html,body {min-width: 100%; min-height: 100%; padding: 0; margin: 0;
font-size: 16px; color: #3b3b3b; line-height: 1.7em; font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Meiryo",sans-serif; word-wrap: break-word; overflow: auto;}
p {line-height: 1.8em; word-wrap: break-word;}
a {text-decoration: none; color: #3b3b3b; overflow: hidden; outline: none; word-wrap: break-word;}

img {vertical-align: top; opacity: 0; animation: 1s fadeIn forwards;}
a img {border: 0; vertical-align: top; opacity: 0; animation: 1s fadeIn forwards;}
@keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}
a:hover img {opacity: 0.6!important; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)"; -moz-opacity:0.6; -khtml-opacity: 0.7;}

/* cancel hamburger */
#menu__toggle, .menu_info {display: none!important;}
/********* header */
.menu__box {float: right;}
.menu__box > li {position: relative; float: left;}
.menu__box a {font-size: 14px; line-height: 2em; float: left;}
.menu__item {padding-left: 40px;}

#head_home .menu__box {margin-top: 15px;}
#head_home.thin .menu__box {margin-top: 0!important;}

/********* header_home */
#header_home {width: 100%; height: 100px;}

#head_home {width: 96%; padding: 0 2%; position: fixed; top: 0; background: #fff; z-index: 1; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; background-color: rgba(255, 255, 255, 0.95); z-index: 200;}

#head_home li {float: left;}

/********* head (thick) */
.thick {height: 100px;}
.thick a img {width: 170px; height: auto; margin-top: 20px;}
.thick li {float: left; display: block;}
.thick ul {padding-top: 20px;}

/********* head (thin) */
.thin {height: 60px;}
.thin a img {width: 100px; height: auto; margin-top: 10px;}
.thin li {float: left; display: block;}
.thin ul {padding-top: 10px;}

.menu__box > .thick {padding-top: 60px;}

/********* header_other*/
#header_other {position: fixed; top: 0; width: 96%; padding: 0 2%; height: 60px; background-color: rgba(255, 255, 255, 0.95); z-index: 1;}
#header_other li {margin-top: 20px;}
#head_other {position: relative; margin: 0 auto;}
#head_other li {padding: 0; float: left;}
#head_other a img {width: 100px; height: auto;}

/********* header共通　*/
.nav {float: right;}
.nav ul {display: none; position: absolute;}
.nav li {padding: 0 5px; margin-left: 30px; position: relative; float: left;}
.nav a {width: 100%; font-size: 13px; float: left;}
.nav a:hover {color: #666;}
.nav a:hover, .nav_current a {border-bottom: 1px solid #666;}
.nav li:hover > ul {display: block; margin-top: 28px;}

.nav_sub {width: 100px; padding: 10px!important; background-color:rgba(234, 234, 234, 1);}
.nav_sub > li {margin: 0!important; padding: 0!important; clear: both;}
.nav_sub > li a {padding-bottom: 15px; border-bottom: 0!important;}
.nav_sub > li a:last-child {padding-bottom: 0;}
.nav_sub > li:last-child a {font-size:14px;}
.nav_sub li a:hover {color: #666;}

/**************************************************** structure width: 1000px*/
#outer {min-height: 100vh; position: relative; padding-bottom: 180px; /* ←フッターの高さを指定 */ box-sizing: border-box;}
#inner {width: 1000px; margin: 40px auto 80px; display: table;}
#inner_top {width: 1000px; margin: 0 auto; display: table;}
.wide {width: 100%; display: table;}
section:nth-of-type(odd) {background-color:#f2f2f2;}
.content {width: 1000px; margin: 0 auto; padding: 60px 0;}

#obi {height: 60px; color: #fff; background: #abced8; padding-top: 90px;}
#obi p {width: 300px; font-size: 20px; text-align: center;
position: relative; padding: 0 40px; margin: 0 auto;}
#obi p:before {position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 1px; content: ''; background: #fff;}
#obi p span {position: relative; padding: 0 0.5em; background: #abced8;}

/**************************************************** footer */
footer {width: 100%; height: 180px; background-color: #abced8; position: absolute; bottom: 0; color: #fff;}
#foot1 {width: 100%; height: 135px;}
#foot2 {height: 45px; background-color: #fff; color: #abced8;}

.foot_obi {width: 100%; height: 135px;}
.foot_obi li:first-of-type {background: url('../img/footer/house.png') repeat-x bottom right; flex: 1;}
.foot_obi li:nth-of-type(2) {margin: 0 auto; padding: 50px 70px 0;}
.foot_obi li:last-of-type {background: url('../img/footer/house.png') repeat-x bottom left; flex: 1;}

.foot_logo {margin-right: 30px; float: left;}
.foot_logo img {width: 170px;}
.foot_info {color: #2f2f2f; float: left;}
.foot_info dt {font-size: 35px;}
.foot_info dd {font-size: 26px;}

.cr {font-size: 12px; line-height: 45px; display: block; text-align: center;}

/********* page top */
#page-top {position: fixed; bottom: 30px; right: 20px; font-size: 12px;}
#page-top a {background: #2f2f2f; text-decoration: none; color: #fff;
width: 100px; padding: 5px 0; text-align: center; display: block; border-radius: 2px;}
#page-top a:hover {text-decoration: none; background: #999;}

/********* pagnation */
.wp-pagenavi {width: 100%; padding-top: 50px; display: block;}

.pages {margin-right: 10px; float: left;}

.wp-pagenavi a {width: 26px; height: 26px; line-height: 26px; background-color: #dfdfdf; color: #fff; display: block; text-align: center; transition: background-color 0.2s ease-in; -webkit-transition: background-color 0.2s ease-in; float: left;}
.wp-pagenavi span.current {float: left;}
.wp-pagenavi a, .wp-pagenavi span {border: 0;}

.wp-pagenavi a:hover, .wp-pagenavi span.current {width: 26px; height: 26px; line-height: 26px; background-color: #abced8; color: #fff; display: block; text-align: center;
transition: 0.2s ease-in; -webkit-transition: 0.2s ease-in;}