/*Theme Name: iecon Version: 1.0*/
/**************************************************** standard elements */
html, body, div, 
an, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video
{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;list-style:none;}

body {width: 100%; line-height: 1.6em; color: #3b3b3b; font-size: 14px; font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Meiryo",sans-serif;}
h1, h2, h3 {font-weight: normal;}
a {color: #3b3b3b; line-height: 1.6em; word-wrap: break-word; text-decoration: none;}

img {max-width: 100%; height: auto;}
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;}

.block {display: block;}

/* hamburger */
#menu__toggle {opacity: 0; display: none;}
#menu__toggle:checked ~ .menu__btn > span {transform: rotate(45deg);}
#menu__toggle:checked ~ .menu__btn > span::before {top: 0; transform: rotate(0);}
#menu__toggle:checked ~ .menu__btn > span::after {top: 0; transform: rotate(90deg);}
#menu__toggle:checked ~ .menu__box {visibility: visible; right: 0;}
.menu__btn {display: flex; align-items: center; position: fixed; top: 20px; right: 20px; width: 26px; height: 26px; cursor: pointer; z-index: 200;}
.menu__btn > span,
.menu__btn > span::before,
.menu__btn > span::after {display: block; position: absolute; width: 100%; height: 2px; background-color: #616161; transition-duration: .25s;}
.menu__btn > span::before {content: ''; top: -8px;}
.menu__btn > span::after {content: ''; top: 8px;}
/*end */

.menu__box {display: block; position: fixed; z-index: 100;
visibility: hidden; top: 0; right: -100%;
width: 320px; height: 100%;
margin: 0; padding: 45px 0;
list-style: none;
background-color: #3b3b3b;
box-shadow: 1px 0px 6px rgba(0, 0, 0, .2);
transition-duration: .25s;
text-align: center;
}

.menu__item {display: block; padding: 8px 24px; color: #fff;
font-size: 14px; text-decoration: none; transition-duration: .25s;}
.menu__item:hover {background-color: #abced8;}

/*plugin*/
.slidemenu {height: 100%; overflow: hidden; position: relative;}
.slidemenu .slidemenu-content {position: relative;}
/*accordion*/
.submenu_accordion a {display: block;}
.submenu_accordion .child, .submenu_accordion .child_cat{display: none; background: #f2f2f2;}
.submenu_accordion .child > li, .submenu_accordion .child_menu> li {padding-left: 40px; padding-bottom: 5px;}
.child01 {padding: 20px 0 15px;}

/*menu_info*/
.menu_info {color: #fff; padding: 15px; margin-top: 40px; }
.menu_info dt, .menu_info dd {width: 100%; padding-right: 0!important; box-sizing:border-box; display: block; text-align: center;}
.menu_info dt {padding-bottom: 10px;}
.menu_info dd {color: #a7a7a7;}
.menu_info a {font-size: 14px; color: #a7a7a7; display: initial;}
.menu_add {font-size: 14px!important; padding: 10px 0; line-height: 1.4em!important;}

a.menu_phone, a.menu_contact {width: 100%; box-sizing: border-box; color: #fff; border: 1px solid #999; padding: 10px 20px; display: inline-block;}
a.menu_phone {margin: 30px 0 0; font-size: 1.4em;}
a.menu_contact {margin: 10px 0 0;}

.telblock {font-size: 0.8em!important; display: block;}

/**************************************************** structure */
/********* header */
header {width: 100%; height: 60px;}
.head_sp {width: 96%; padding: 0 2%; height: 50px; background-color: rgba(255, 255, 255, 0.95); z-index: 1; padding-top: 10px;}
/********* logo */
.head_sp a img {width: 130px; height: auto; float: left;}

/******************************** structure */
#outer {min-height: calc(100vh - 60px); position: relative; box-sizing: border-box;}
#inner {width: 100%; padding-bottom: 30px;}
#inner_top {width: 100%;}
.wide {width: 100%; display: table;}
section {padding: 20px 0;}
section:nth-of-type(odd) {background-color:#f2f2f2;}
.content {max-width: 96%; padding: 20px 2% 40px;}

#obi {height: 40px; color: #fff; background: #abced8; padding-top: 20px;}
#obi p {text-align: center;}

/**************************************************** footer */
footer {width: 100%; height: 60px; background-color: #abced8; position: absolute; bottom: 0; color: #fff;}
#foot1 {width: 100%; height: 40px;}
#foot2 {height: 20px; background-color: #fff; color: #abced8;}
.foot_obi {width: 100%; height: 60px; padding: 10px 0 0 7px;}

.foot_logo {margin-right: 10px; float: left;}
.foot_logo img {width: 80px;}
.foot_info {color: #2f2f2f; float: left; line-height: 40px;}
.foot_info dt {font-size: 18px; line-height: 1em; padding-right: 10px; float: left;}
.foot_info dd {display: none;}

.cr {font-size: 12px; line-height: 20px; padding-left: 10px;}

/********* page top */
#page-top {position: fixed; bottom: 20px; right: 10px; font-size: 10px;}
#page-top a {background: #2f2f2f; text-decoration: none; color: #fff;
width: 80px; 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%; margin: 30px 0 0; display: inline-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: #164a84; color: #fff; display: block; text-align: center;
transition: 0.2s ease-in; -webkit-transition: 0.2s ease-in;}

/**************************************************** Top */
/**************************** Image */
#header_image {width: 100%; position: relative;}
#header_image img {width: 100%;}
#header_image p {width: 94%; padding: 0 3%; font-size:17px; color: #fff; font-weight: 600;
position: absolute; top: 50%; left: 50%; text-align: center;
-ms-transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);transform: translate(-50%,-50%); margin:0; padding:0; z-index: 2;}

/**************************** News overwrite */
#news_overwrite {margin: 1em 2%; padding: 15px; box-sizing: border-box; background-color: #f2f2f2;}
#news_overwrite p {margin: 0; padding: 0;}
#news_overwrite a {text-decoration: underline;}
#news_overwrite strong {font-weight: 600;}
#news_overwrite em {font-style: italic;}

/**************************** Content */
#top {width: 100%; margin-bottom: 60px; display:inline-block;}

#top h1 {font-size: 1.2em; font-weight: 600; padding-bottom: 10px; text-align: center;}
#top h2, #top h3, #top h4 {font-weight: bold; position: relative;}
#top h2 {font-size: 1.2em; padding: 0 0 20px 25px;}
#top h3, #top h4 {font-size: 1.0em; padding: 3px 0 10px 20px;}

#top h2:before, #top h3:before, #top h4:before {background: #e01e26; content: ""; left: 0; position: absolute;}
#top h2:before {width: 17px; height: 17px; top: 3px;}
#top h3:before, #top h4:before {width: 15px; height: 15px; top: 7px;}

.oneblock {white-space: nowrap;}

.box {width: 100%; padding: 20px 20px 0 20px; box-sizing: border-box; background-color: #f2f2f2; margin-bottom: 20px;}
.box:first-of-type {margin-top: 40px;}
.box ul {width: 100%; padding: 0 0 0 40px;}
.box li {list-style-type: disc;}
.box p {padding: 20px 20px 20px 0; box-sizing: border-box;}

.service {width: 100%; background-color: #abced8; padding: 15px; box-sizing: border-box;}
.service ul li {padding-left: 30px; line-height: 1.6em;
background: url('../img/top/check.png') left 0px top 3px no-repeat;
background-size: 20px auto;
font-size: 1.1em; line-height: 1.8em; 
list-style-position: inside;}

/***************** recent estate */
.recent_estate {max-width: 430px; padding: 15px; box-sizing: border-box; background-color: #f2f2f2; margin-top: 15px;}
.recent_estate img {min-width: 100%; height: auto;}
.recent_estate li:first-of-type {padding-top: 8px;}
.recent_estate li:nth-child(2) {font-size: 0.9em; line-height: 1em;}

/**************************************************** iecon / akiya */
.picto h1 {font-size: 1.2em; font-weight: 600; padding-bottom: 20px;}

.title {position: relative; padding: 0.5em 1em; background: #666; color: #fff; font-size: 0.8em; font-weight: normal!important;}
.title::before {position: absolute; content: ''; top: 100%; left: 0; border: none; border-bottom: solid 10px transparent; border-right: solid 15px rgb(149, 158, 155);}
.picto h2 {padding-bottom: 40px;}
.sub_title {padding: 30px 0 0 0; display: block;}

.picto ul {width: 100%; padding-bottom: 40px; display: table;}
.picto li {float: left;}
.picto img {max-width: 100%; height: auto;}

.formbtn_ie, .formbtn_akiya  {color: #fff; padding: 5px 20px; clear: both;}
.formbtn_ie {background-color: #abced8;}
.formbtn_akiya {background-color: #abce96;}

/******************** transportation expenses */
.expenses {border: 1px solid #ccc; background-color: #f2f2f2; padding: 15px; margin: 20px; box-sizing: border-box;}
.expenses h3 {font-weight: 600; padding-bottom: 20px;}
.expenses h4 {font-weight: 600; padding-bottom: 5px;}
.expenses p:first-of-type {padding-bottom: 20px;}

/******************** form */
.form_section {width: 90%; margin: 0 auto 80px;}
.form_title {font-size: 1.4em; text-align: center; padding: 60px 0 40px;}
.form_title span {font-size: 0.8em; padding-left: 15px;}

.wpcf7-list-item {width: 100%; display: table;}

.form dt {font-weight: 600; padding-bottom: 5px;}
.form dd {margin-bottom: 15px;}

.con {width: 100%; height: 26px; padding: 0; border:0; font-size: 16px; color: #000; background: #f2f2f2; margin-bottom: 10px;}
.mes {width: 100%; height: 160px; padding: 0; border: 0; font-size: 16px; color: #000; background-color: #f2f2f2; overflow-y: auto;}

/**************************************************** Estate + Works */
.flex {display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: flex-start; margin-bottom: 30px;}
.item {width: 49%; margin: 0 1% 4% 0; overflow: hidden; box-sizing: border-box; background-color: #f2f2f2; position: relative;}
.item:nth-child(3n) {border-right: 0%;}

.item_img {position: relative;}
.item img {width: 100%; height: auto; vertical-align: bottom; object-fit: cover; object-position: center center;}

.buysell, .rent {position: absolute; color: #fff; top: 0; right: 0; width: 0; height: 0; border-style: solid; border-width: 0 60px 60px 0;}
.buysell p, .rent p {font-size: 0.8em; width: 50px; padding: 5px 5px 0 0; text-align: right;}

.buysell {border-color: transparent #999 transparent transparent;}
.rent {border-color: transparent #333 transparent transparent;}

.item h1 {font-size: 1.1em; line-height: 1.2em; padding: 15px 15px 0 15px;}
.item h2 {font-size: 0.9em; margin-bottom: 10px; padding: 0 15px;}

.item dl {font-size: 0.9em; margin: 15px 15px 0 15px;}
.item dt {width: 60px; clear:both; float:left; border-top: 1px dotted #b3b3b3;}
.item dd {width: auto; margin: 0 0 0 60px; border-top: 1px dotted #b3b3b3;}

.estate_info {padding-bottom: 60px;}

.pdf {background-color: rgb(32, 12, 12); color: #fff; font-size: 0.8em; padding: 5px 25px;}
.pdf:hover {background-color: #666;}
.release {width: 100%; font-size: 0.8em; background-color: #d9d9d9; padding: 3px 15px; position: absolute; bottom: 0; margin-top: 60px;}

.item ul {font-size: 0.9em; margin: 0 15px 40px 15px; padding-top: 10px; border-top: 1px dotted #b3b3b3; line-height: 1.4em;}
.item li:nth-child(2) {padding-top: 10px;}

/**************************************************** Company */
#company h1 {font-size: 1.2em; padding-bottom: 20px;}
#company dl {margin: 0 0 40px 0; line-height: 2.4em;}
#company dt {width: 70px; clear:both; float:left; border-top: 1px dotted #b3b3b3;}
#company dd {width: auto; margin: 0 0 0 70px; border-top: 1px dotted #b3b3b3;}

#company h2 {font-size: 0.9em; font-weight: 600; padding: 20px 0 10px;}
.sq {width: 100%;}
.sq:first-of-type {margin-bottom: 20px;}
.sq li span {padding-right: 10px;}

/***************** Access */
.access {width: 100%; margin: 80px 0; display: table;}

.ggmap {position: relative; padding-bottom: 80%; height: 0;}
.ggmap iframe,
.ggmap object,
.ggmap embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}