@charset "utf-8";

/*
Theme Name: kloom2013
Author: kloom
Description: kloom2013
*/


/*  00 reset
==========================================================*/

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

html, body, div, 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:13px;
	line-height:2;
	color:#333;
	vertical-align:middle;
	background:transparent;
}



html {
	overflow-y:scroll;
}


body {
    line-height:1;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:middle;
    background:transparent;
}


table {
    border-collapse:collapse;
    border-spacing:0;
}

hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

img {
	border: 0;
}

/*----------------------------------------------------------
	*01 link
	*01 font family
	*02 common layout and heading
	*03 header
	*05 top
	*06 works
	*07 about
	*08 service
	*09 blog
	*00 common parts
----------------------------------------------------------*/


/*  01 link
==========================================================*/


a:link,
a:visited {
	color: #9b2e35;
	text-decoration: none;
}


a:hover,
a:active {
	color: #CA4A54;
	text-decoration: underline;
}

header nav li a:link,
header nav li a:visited {
	color: #AAA;
	text-decoration: none;
}

header nav li a:link span,
header nav li a:visited span,
article header a:link,
article header a:visited {
	color: #333;
	text-decoration: none;
}

header nav li a:hover span,
header nav li a:active span,
article header a:hover,
article header a:active {
	color: #9b2e35;
	text-decoration: none;
}

header nav li a.current:link span,
header nav li a.current:visited span,
header nav li a.current:hover span,
header nav li a.current:active span {
	color: #9b2e35;
	text-decoration: none;
}


div#top_works section li a:link,
div#top_works section li a:visited {
	color: #AAA;
	text-decoration: none;
}

div#top_works section li a:hover,
div#top_works section li a:active {
	text-decoration: underline;
}

aside a:link,
aside a:visited {
	color:#919191;
	text-decoration: none;
}

aside a:hover,
aside a:active {
	text-decoration: underline;
}



a.bu {
	padding:13px 80px;
	color:#FFF;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-moz-box-shadow: 0px 1px #c0bfbf;
	-webkit-box-shadow: 0px 1px #c0bfbf;
	box-shadow: 0px 1px #c0bfbf;
}

a.bu:link,
a.bu:visited {
	background-color:#9b2e35;
	text-decoration: none;
}

a.bu:hover,
a.bu:active {
	background-color:#B3353F;
	text-decoration: underline;
}

a.bu span {
	background-image: url(imgs/bu_arrow.gif);
	background-repeat: no-repeat;
	background-position: 0px 7px;
	padding-left: 14px;
}

span.more a {
	padding:10px 0px;
}



/*  01 font family
==========================================================*/
body, textarea, h2 span {
	font-family: 'Noto Sans JP','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',Sans-Serif;
}

section#main_area h2,
header nav li span,
div.menubtn span,
footer{
	font-family:'Inter', sans-serif;
	font-weight: 400;
}

h2,
section#main_area h2 span,
h1 span,
div.service_box h3 span,
aside h2 span {
	font-family:'Inter', sans-serif;
	font-weight: 700; 
}


/*  02 common layout and heading
==========================================================*/
body {
	text-align: center;
	background-color: #FFF;
	background-image: url(imgs/top_border.gif);
	background-repeat: repeat-x;
	-webkit-text-size-adjust: none;
}

h1 {
	font-size: 17px;
	line-height:1.4;
	padding-bottom: 14px;
	margin-top:30px;
}

h1 span {
	font-size: 45px;
}

h2 {
	font-size: 31px;
	margin-bottom: 20px;
	vertical-align: middle;
	line-height:1.2;
}

h2.common_h2 {
	text-align:center;
	margin-bottom: 0px;
}



h3.sub {
	font-size:13px;
	font-weight:normal;
	color: #666;
	line-height:1.4;
	margin-bottom: 20px;
}

p {
	margin-bottom: 10px;
}


/*  03 header
==========================================================*/
header {
	border-bottom: 1px solid #e7e7e7;
	padding-top: 28px;
}

header h1 {
	border-bottom: 1px solid #e7e7e7;
	margin-top:0;
}

p#headlogo {
	border-bottom: 1px solid #e7e7e7;
	padding-bottom: 14px;
	margin:0;
}

div.menubtn {
	display:none;
}


header nav {
	width: 960px;
	background-color: #FFF;
	text-align: center;
	margin: 0px auto;
}


header nav li {
	font-size:11px;
	text-align: center;
	width:160px;
	float:left;
	line-height:1.4;
	color:#ccc;
}

header nav li span {
	font-size:15px;
}

header nav li a {
	padding: 10px 0px;
	display: block;
}




footer {
	width: 100%;
	padding: 40px 0px;
	border-top: 1px solid #e7e7e7;
	font-size: 13px;
	background-color: #f7f5ec;
	margin-top: 50px;
}


/*  05 top
==========================================================*/

section#main_area {
	margin: 50px auto 0px;
	border:none;
	padding:0;
}


div#main_logo {
	margin: 0px;
}


section#main_area h2 {
	padding-top: 20px;
	font-size: 24px;
	margin: 0px;
	border:none;
}

section#main_area h2 span {
	font-size: 55px;
	padding-left: 5px;
	color:#333;
}

section#main_area h3 {
	font-size: 21px;
	margin-bottom: 12px;
}

section#main_area h3 span {
	color:#9b2e35;
}

div#main_tx p {
	font-size: 15px;
}


section#main_area p#main_sub {
	font-size: 11px;
	color: #5A5A5A;
}

div.inner_box {
	width:934px;
	text-align: center;
	padding-bottom: 20px;
	margin: 0px auto;
}

.block {
	border-top: 1px solid #e7e7e7;
	margin: 40px auto;
	padding-top:40px;
}

div#top_works {
	margin: 20px -47px 30px 0px;
}

div#top_works section {
	float: left;
	width: 327px;
}

div#top_works section p {
	margin: 10px 47px 10px 0px;
	text-align: left;
	font-weight: bold;
	font-size: 16px;
	line-height:1.6;
	text-align:center;
}

div#top_works section p span {
	font-weight: normal;
	font-size: 13px;
}

div#top_works section p.img {
	padding: 1px;
	background-color: #E3E3E3;
	margin-right: 47px;
}

div#top_works section ul {
	margin-right: 47px;
}

div#top_works section li {
	font-size: 11px;
	display: inline;
	background-image: url(imgs/arrow.gif);
	background-repeat: no-repeat;
	padding-left: 14px;
}

div#top_works section li.blank_gr {
	background-image: url(imgs/blank_gr.gif);
	background-repeat: no-repeat;
	background-position: 6px 0px;
	padding-left: 20px;
	margin-left:7px;
	border-left: 1px solid #d6d6d6;
}


/* style ------------------------------------------------
	*07 about
----------------------------------------------------------*/

div.message {
	width:934px;
	padding-bottom: 20px;
	margin: 0px auto;
}



section.prof_box01,
section.prof_box02 {
	width:437px;
	float:left;
	text-align:left;
	padding-top:20px;
}

section.prof_box01 {
	margin-right:60px;
}

div.prof_inner p {
	float:left;
	width:218px;
}

div.prof_inner span.name {
	font-size:17px;
	font-weight:bold;
	padding-right:10px;
}

div.prof_inner span.yomi {
	font-size:9px;
}


/* style ------------------------------------------------
	*08 service
----------------------------------------------------------*/

div.service_box {
	width:560px;
	margin: 0px auto 80px;
	text-align:left;
}

div.service_box h3 {
	font-size: 15px;
	margin-top:40px;
}

div.service_box h3 span {
	font-size: 21px;
}


ul.common {
	margin-bottom:40px;
	border-top: 1px solid #e7e7e7;
	border-bottom: 1px solid #e7e7e7;
	padding: 10px 0px 10px 10px;
}

ul.common li {
	list-style-type: disc;
	list-style-position: inside;
}

dt {
	font-weight: bold;
	font-size: 16px;
	margin-top: 20px;
}

table {
	color: #262626;
	margin-bottom: 40px;
	border-top: 1px solid #e7e7e7;
	width:100%;
}

th {
	padding:10px;
	font-size: 14px;
	white-space: nowrap;
	line-height: 1.4;
	border-right: 1px dotted #c9c9c9;
	border-bottom: 1px solid #e7e7e7;
	width:150px;
}

td{
	padding:10px;
	vertical-align: middle;
	line-height: 1.4;
	border-bottom: 1px solid #e7e7e7;
}


/* style ------------------------------------------------
	*06 works
----------------------------------------------------------*/

div.section_inner {
	width:960px;
	margin: 0px auto;
	text-align:left;
}

p.works_img {
	float: left;
	width: 440px;
	padding-top: 10px;
}

p.works_img img {
	border: 1px solid #e7e7e7;
}

div.works_tx {
	float: left;
	width: 520px;
	padding-top: 5px;
}



p.date {
	font-size: 11px;
	font-weight:bold;
	margin-bottom:0px;
}

div.works_tx h2 {
	line-height:1.2;
	margin-bottom:10px;
}

div.works_tx h2 span {
	font-size: 15px;
	font-weight:normal;
}

p.blank {
	background-image: url(imgs/blank.gif);
	background-repeat: no-repeat;
	background-position: 0px 10px;
	padding-left: 17px;
}

p.part {
	font-size: 11px;
	color:#5A5A5A;
}


/* style ------------------------------------------------
	*09 blog
----------------------------------------------------------*/

div#wrap {
	width: 860px;
	margin: 30px auto 0px;
	text-align: left;
	background-image: url(imgs/dotline_vertical.gif);
	background-repeat: repeat-y;
	background-position: 624px 0px;
}

div#content {
	width: 600px;
	float: left;
}

aside {
	width: 210px;
	float: right;
}

p.lead {
	border-bottom: 1px solid #e7e7e7;
	padding-bottom:40px;
}

article {
	padding-bottom:20px;
	margin-bottom:20px;
	background-image: url(imgs/dotline.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
}

article p {
	margin-bottom:20px;
}

article header {
	border-bottom: none;
	padding-top: 0px;
}

article h2 {
	font-size:24px;
	margin-bottom:0px;
}

article h3 {
	font-size:18px;
	margin-bottom:0px;
}


div.entry_meta,time {
	color:#919191;
}

div.entry_meta {
	margin-bottom:20px;
}

aside h2 {
	font-size:11px;
	color:#919191;
	margin-bottom:5px;
}

aside h2 span {
	font-size:18px;
	padding-right:10px;
	color: #333;
}

aside section {
	padding-bottom:20px;
	margin-bottom:20px;
	background-image: url(imgs/dotline.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
}

aside ul li {
	list-style:none;
	line-height:1.3;
	padding-bottom:5px;
}

div#twitterbox {
	width: 210px;
}

li.comment {
	list-style-type: none;
	margin-bottom: 30px;
}

.tx10 {
	font-size:10px;
}

strong {
	font-weight:bold;
}

.marker {
	background-color: #F7F2E1;
}

/* style ------------------------------------------------
	*08 contact
----------------------------------------------------------*/
div.contact_box {
	width:560px;
	margin: 0px auto 80px;
	text-align:left;
}

div.contact_box textarea {
	width:273px;
}

div.contact_box input.wpcf7-submit {
	padding:10px;
	font-size:14px;
}
/* =========================================================
	*00 clearfix
========================================================= */
.box:after{
	content: '';
	display: block;
	clear: both;
 }