@charset "UTF-8";
/*================================
 o/w
=================================*/

/*================================
 SYSTEM
=================================*/

#topnav {
background-color:#fff;
}

.wrapper#system{
padding-top:120px!important;
margin-bottom: 20px;
}

#system header{
overflow: hidden;
height:240px;
background: linear-gradient(#fff 37% ,#f7f7f7 37% ,#f7f7f7 100%)!important;
}

#system header .row_inner{
overflow: hidden;
height:240px;
}

#system header h2{
position: relative;
background:url(../img/system/header_tit.png) no-repeat center center;
display: block;
width:400px;
height:240px;
margin:0 auto;
text-align: center;
}

#system main{
background-color:#f7f7f7;
}


/* for blog list #post(main block)
-------------------------------- */

.blog2list{
position:relative;
overflow:hidden;
}

/*
---------------------*/
.blog2list .blog2ul{
position:relative;
overflow:hidden;
float: left;
display: block;
width:860px;
margin-left:20px;
}


/* for blog single
----------------- */

.blogsingle{
position: relative;
overflow: hidden;
}

.blogsingle #posts{
overflow: hidden;
float: left;
width:890px;
margin-left:20px;
}

.blogsingle #posts .post{
padding:40px 40px;
margin-bottom:50px;
background-color: #fff;

}

.blogsingle .post .post_header{
position: relative;
display: block;
min-height:120px;
margin-bottom:50px;
text-align: center;
}

.blogsingle .post .post_header h2{
display: block;
overflow: hidden;
font-size:24px;
font-weight: bold;
line-height:1.5em;
color:#000000;
text-align: left;
padding:20px 0 20px;
margin:0;
}

.blogsingle .post .post_header .desc{
display:block;
line-height:1.5;
text-align: left;
font-size:15px;
line-height:1.8;
padding:10px 0;
margin-bottom: 30px;
border-radius: 5px;
}

.blogsingle .post .post_header .desc span.date{
display: inline-block;
font-size:14px;
color:#aaa;
letter-spacing: 0.04em;
margin-left:20px;
}

.blogsingle .post .post_header .desc span.tit{
display: inline-block;
font-size:11px;
color:#624C3E;
}

.blogsingle .post .post_header .desc ul.terms{
position: relative;
display:inline-block;
}
.blogsingle .post .post_header .desc ul.terms li{
position: relative;
display:inline-block;
margin-right:20px;
}
.blogsingle .post .post_header .desc ul.terms li::after{
display:block;
position: absolute;
content:" | ";
top:0;
right:-13px;
}
.blogsingle .post .post_header .desc ul.terms li:last-child::after{
content:"";
}


/* ===========================
with visual editor stylesheet
============================ */

.blogsingle .post .post_content {
padding:0;
line-height:1.8em!important;
margin:20px 0 60px;
}

/* overwrite on initial style */
.blogsingle .post .post_content strong{
font-weight: bold;
}

.blogsingle .post .post_content em{
font-style: italic;
}

.blogsingle .post .post_content a{
text-decoration: underline;
}

.blogsingle .post .post_content p{
line-height: 1.8em;
}

/* require for using classic-editor */
.blogsingle .post .post_content img{
max-width: 100%;
height:auto;
}
img.alignright{
display: block;
margin: 0 0 0 auto;
}
img.alignleft{
display: block;
margin: 0 auto 0 0;
}
img.aligncenter{
display: block;
margin: 0 auto;
}

/* with extra visual editor stylesheet */
.blogsingle .post .post_content h1 {
font-size: 32px;
line-height: 1.8em;
}

/* with extra visual editor stylesheet */
.blogsingle .post .post_content h2 {
/*
font-size: 28px;
line-height: 1.8em;
*/
display: block;
font-size: 24px;
font-weight: normal;
line-height: 1.8em;
color:#fff;
background-color:#1E3557;
padding:0.7em 0.5em;
margin:1em 0;

}

/* with extra visual editor stylesheet */
.blogsingle .post .post_content h3 {
/*
font-size: 24px;
line-height: 1.8em;
*/
display: block;
font-weight: normal;
font-size: 24px;
line-height: 1.8em;
padding:0.2em 0.5em;
margin:1em 0;
border-bottom:5px solid #D0CDD4;

}

/* with extra visual editor stylesheet */
.blogsingle .post .post_content h4 {
font-size: 20px;
line-height: 1.8em;
}
.blogsingle .post .post_content h5 {
font-size: 18px;
line-height: 1.8em;
}
.blogsingle .post .post_content h6 {
font-size: 16px;
line-height: 1.8em;
}

/* SOC
-------------------------------- */

.blogsingle .soc{
display:block;
padding:10px 20px;
margin:20px 0;
line-height:30px;
background-color: #E7E4DF;
}

.blogsingle .soc span{
font-size:1em;
font-weight: 900;
line-height:30px;
color:#111;
margin-right:20px;
}

.blogsingle .soc .socbtns{
display:inline-block;
padding:0;
margin:0;
}

.blogsingle .soc .socbtns a.socbtn{
display:inline-block;
vertical-align:middle;
margin-right:10px;
transition: 0.2s;
}

.blogsingle .soc .socbtns a.socbtn:hover{
opacity:0.7;
}

.blogsingle .soc .socbtns a.socbtn.btn_fb{
background:url(./../img/element/btn_blog_fb.png) no-repeat center center #eee;
background-size:99px 33px;
width:99px;
height:33px;
}

.blogsingle .soc .socbtns a.socbtn.btn_tw{
background:url(./../img/element/btn_blog_tw.png) no-repeat center center #eee;
background-size:99px 33px;
width:99px;
height:33px;
}

.blogsingle .soc ul.soc_terms{
position: relative;
display:inline-block;
}
.blogsingle .soc ul.soc_terms li{
position: relative;
display:inline-block;
margin-right:20px;
}
.blogsingle .soc ul.soc_terms li::after{
display:block;
position: absolute;
content:" | ";
top:0;
right:-13px;
}
.blogsingle .soc ul.soc_terms li:last-child::after{
content:"";
}


/* PageNavi
-------------------------------- */

.navigation{
width:100%;
display:block;
overflow:hidden;
padding:60px 10px 80px;
text-align:center;
font-size:1.4em;
}

.wp-pagenavi{
display:block;
overflow:hidden;
width:900px;
margin:0 auto;
}

.wp-pagenavi a{
display:inline-block;
line-height:1;
font-size:0.76em;
color:#111;
padding:8px 12px!important;
margin:4px;
background-color:#fff;
}

.wp-pagenavi a:hover{
color:#fff;
background-color:#A28961;
text-decoration: none;
}

.wp-pagenavi span.current{
display:inline-block;
line-height:1;
font-size:0.76em;
color:#fff;
padding:8px 12px;
background-color:#A28961;
margin:4px;
}

.single_navigation{
position:relative;
width:auto;
height:50px;
display:block;
padding:0;
text-align:center;
margin:0 auto;
}

.single_navigation ul{
display:block;
position:relative;
}

.single_navigation ul li{
display:block;
width:193px;
height:50px;
position: absolute;
top:0;
}

.single_navigation ul li a{
overflow: hidden;
display:block;
padding:0 25px;
font-size:15px;
font-weight:normal;
text-decoration-line: none!important;
color:#fff;
background-color:#111;
text-align: center;
line-height:50px;
}

.single_navigation ul li a:hover{
text-decoration: none;
color:#fff;
opacity:0.77;
transition:0.2s;
}

.single_navigation ul li.prev  { left:0; }
.single_navigation ul li.back  { left:204px; }
.single_navigation ul li.next  { left:408px; }
.single_navigation ul li.front { left:612px; width:198px;}
.single_navigation ul li.prev a  { text-align: left; }
.single_navigation ul li.back a  { text-align: center; }
.single_navigation ul li.next a  { text-align: right; }
.single_navigation ul li.front a {
text-align: center;
background-color:#A28961;
}


/* subnav
-------------------------------- */

.subnav{
display: block;
position: relative;
background-color:#f7f7f7;
margin-bottom: 0;
}

.subnav ul{
display: block;
overflow: hidden;
padding: 20px;
}

.subnav ul li {
position: relative;
display:inline-block;
float:left;
vertical-align: baseline;
font-size:16px;
font-weight: bold;
padding:0;
margin:0 20px 0 0!important;
text-align: center;
}

.subnav ul li a{
position: relative;
display:block;
color:#111;
line-height:30px;
letter-spacing: 0.04em;
padding:0;
cursor:pointer;
opacity:0.96;
transition: 0.2s;
}

.subnav ul li a.current {
color:#fff;
background-color:#1E3557;
padding:0 15px;
border-radius: 15px;
}


/* for blog single and list
   #rowcats(bottom block)
-------------------------------- */

#rowcats{
overflow: hidden;
}

#rowcats .row_inner{
float: right;
width:300px;
margin:0 auto 100px;
border-radius: 25px;
text-align: center;
}

#rowcats .onebox{
display: inline-block;
vertical-align: top;
width:100%;
margin-bottom:30px;
}

#rowcats .row_inner .onebox{
position: relative;
padding:0;
text-align: left;
}

#rowcats .onebox h3 a{
display: block;
overflow: hidden;
position: relative;
font-size: 16px;
text-align: left;
color:#fff;
line-height:60px;
text-indent:20px;
padding: 0;
white-space: nowrap;
background-color: #A28961;

}

#rowcats .onebox ul{
display:block;
}

#rowcats .onebox ul li{
position: relative;
}

#rowcats .onebox ul li a{
display: block;
overflow: hidden;
position: relative;
font-size: 16px;
text-align: left;
line-height:56px;
text-indent:20px;
padding: 0;
white-space: nowrap;
background-color:#fff;
border-bottom:1px dotted #E7E4DF;
}

#rowcats .onebox a:hover{
opacity: 0.77;
transition:0.2s;
}