@charset "utf-8";
/* CSS Document */

main section {
	margin:0;
}

#topimg {
	width:100%;
	padding-bottom:73px;
}
#main_content .about h1 {
	clear:both;
	margin:35px auto;
	font-size:34px;
	font-weight:normal;
	text-align:center;
	width:40%;
	background: rgba(255,255,255,0.6);
	padding:4%;
}

/* ご案内 */
 #messe{
	border:4px solid #eac91d;
	border-radius:30px;
	padding:24px 0;
	position:relative;
}

#messe h1 img{
	position:absolute;
	top:-5%;
	left:39%;	
	}
#messe .maruimg img{
	position:absolute;
	top:-17%;
	}
#messe div{
	margin:0 auto;
	width:74%;
	}
#top_messe div .redb{
	color:#F00;
	font-size:34px;
	font-weight:bold;
	text-align:center;
	}
#top_messe div p{
	font-size:1.3em;
	}
#messe .container{
  display: flex;
  margin-top:24px;
}

/* 業務内容 */
#content1 {
	padding:20px 0px 80px 0px;
	background-color:#f2efeb;
	border-radius:30px;
	margin:60px auto;
}

#content1 ul {
	display:flex;
	flex-wrap: wrap;
	margin-left: 72px;
}

*#content1 ul li {
	margin:20px 20px 40px;
	background-color:#FFF;
	/*width:50%;*/
}

#content1 ul li img {
	vertical-align:bottom;
	 -moz-transition: -moz-transform 0.5s linear;
    -webkit-transition: -webkit-transform 0.5s linear;
    -o-transition: -o-transform 0.5s linear;
    -ms-transition: -ms-transform 0.5s linear;
    transition: transform 0.5s linear;
}

#content1 ul li img:hover{
	-webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

#content1 h1 {
	color:#4c4a0e;
	line-height:1.3;
	margin-bottom:30px;
}

/*.age_waku {
	font-size:12px;
	border:solid 1px #333;
	background-color:#fff;
	width:8em;
	text-align:center;
	float:right;
	position:absolute;
	right:60px;
	bottom:40px;
}
.age_waku a {
	padding:1px 5px;
	display:block;
	transition:0.5s ;
	text-decoration:none;
	color:#333;
}
.age_waku a:hover,
.age_waku a:hover:before {
	color:#666;
}
.age_waku a::before {
	font-family: "FontAwesome";
	content: "\f105";
	padding-right:7px;
	padding-left:5px;
	top:-1px;
	position:relative;
	color:#000;
}*/

/* 業務内容3つ */
/*.bwWrapper {
	position:relative;
	display:block;
}*/

/* 身近で敷居の低い法律事務所 */
#ease{
	background:url(img/top/bg.jpg) no-repeat top center;
	position:relative;
	margin-bottom:11%;
	padding-bottom:3%;
	}
#content2{
	padding-top:30px;
	}
#content2 .textl{
	color:#FFF;
	font-size:2.4em;
	}
#content2 p{
	font-size:1.3em;
	width:84%;
	margin-bottom:3%;
	text-indent:1em;
	}
 #content2 ul {
	margin-top:4%;
	display:flex;
	justify-content:space-between;
	align-items: center;
}
#content2 ul li img{
	position:absolute;
	top:70%;
	margin-top:4%;
	    left: 15%;
	}

#content2 ul li {
	width:33.333%;
	height:auto;
}
#content2 ul .consul{
	font-size:1.7em;
	color:#1869ad;
	border-radius:30px;
	background-color:#FFF;
	padding:14px;
	text-align:center;
	margin-left: 45%;
}
#content2 ul .consul a{
	color:#1869ad;
	text-decoration:none;
	}	
	
/*#content2 ul li img {
	vertical-align:bottom;
	
    -moz-transition: -moz-transform 0.5s linear;
    -webkit-transition: -webkit-transform 0.5s linear;
    -o-transition: -o-transform 0.5s linear;
    -ms-transition: -ms-transform 0.5s linear;
    transition: transform 0.5s linear;
}

#content2 ul li img:hover {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}*/

/* アピール */
/*#proposal {
	padding:100px 0 200px 0;
	background:url(img/top/bg2.jpg) no-repeat center center;
	background-size:cover;
	color:#000;
}

#proposal #white_bg {
	background-color:#fff;
	padding:10px 10px 35px 10px;
	width:60%;
}*/

/* NEWS */
/*#news #tln_title {
	float:left;
	width:25%;
}*/



/* NEWS */
#news #tln_title div {
	width:100%;
	background-color:#1869ad;
	color:#fff;
	/*margin-left:-500px;
	padding-left:500px;*/
}

#news #tln_title div h1 {
	margin:20px auto;
	padding:7px 17px;
	line-height:1.3;
	font-size: 1.7em;
}

main #news #tln_title div h1 span {
	/*display:block;*/
	font-size:17px;
	font-weight:normal;
	color:#fff;
}
main #news #tln_title div h1 span:before {
	margin-left:9px;
}

#news ul {
	float:right;
	width:81%;
	margin-top:22px;
	margin-bottom:50px;
}

#news ul li {
	line-height:27px;
	border-bottom:dotted 1px #999;
}
#news ul li a {
	text-decoration:none;
	color:#333;
}

#news ul li span {
	margin-right:40px;
}

/* blog */
#blog #tln_title div {
	width:100%;
	background-color:#1869ad;
	color:#fff;
	/*margin-left:-500px;
	padding-left:500px;*/
}

#blog #tln_title div h1 {
	margin:20px auto;
	padding:7px 17px;
	line-height:1.3;
	font-size: 1.7em;
}

main #blog #tln_title div h1 span {
	/*display:block;*/
	font-size:17px;
	font-weight:normal;
	color:#fff;
}
main #blog #tln_title div h1 span:before {
	margin-left:9px;
}

#blog ul {
	float:right;
	width:81%;
	margin-top:22px;
	margin-bottom:50px;
}

#blog ul li {
	line-height:27px;
	border-bottom:dotted 1px #999;
}
#blog ul li a {
	text-decoration:none;
	color:#333;
}

#blog ul li span {
	margin-right:40px;
}

/* 詳細 */
.ichiran {
	font-size:12px;
	border:solid 1px #333;
	width:8em;
	}

.ichiran a {
	padding:1px 5px;
	display:block;
	transition:0.5s ;
	text-decoration:none;
	color:#333;
}
.ichiran a:hover,
.ichiran a:hover:before {
	color:#666;
}
.ichiran a::before {
	font-family: "FontAwesome";
	content: "\f105";
	padding-right:7px;
	padding-left:5px;
	top:-1px;
	position:relative;
	color:#000;
}
.hover-ocu:hover{
	filter:alpha(opacity=0.5);
opacity:0.5;
}



/*===============================================
 分岐
===============================================*/
@media screen and ( max-width:600px) { 
/*#topimg img {
	width:200%;
}
*/

#topimg {
     padding-bottom:0;
}
/*.fadein {
	display:none;
}

#slide_outer {
	display:none;
}*/
#messe h1{
	margin-top: -11px;
    text-align: center;
	margin-bottom:-10px;
}
#messe h1 img{
	position: static;
	width:90%;
	height:auto;
	text-align:center;
	top:1%;
	}
#top_messe #messe .maruimg{
	text-align:center;
	}
#messe .maruimg img{
	position: static;
	width:40%;
	height:auto;
	}
#messe .container{
	display: block;
}
#messe .container .item img{
	width:100%;
	margin:0 auto;
	height:auto;
}
#top_messe div .redb {
    font-size: 21px;
}

#content1 {
	padding:20px 0;
	background:none;
}

#content1 ul {
	display:block;
}

#content1 ul li {
	width:100%;
	margin:0 auto;
}

#content1 ul h1,
/*#content1 ul .ptext*/ {
	padding:0 20px;
}

	
#content2 p {
    font-size: 1.3em;
    width: 100%;
}

/*#content1 ul .w_img2,
#content1 ul .w_img3 {
	padding:20px 0 60px 0;
}

#content1 ul .w_img3 h1 {
	margin-top:0;
}

#content1 ul .w_img1 img,
#content1 ul .w_img4 img {
	width:100%;
	margin:0;
	
	background-color:#f6fbff;
}

.age_waku {
	bottom:20px;
	right:20px;
}
*/

#ease{
	position: static;
	}

#content2 ul {
	display: block;
}
#content2 ul li {
	width:100%;
	height:auto;
}

#content2 ul li img{
	position: static;
	width:70%;
	height:auto;
	}
#content2 ul .consul{
	width:70%;
	font-size:1.1em;
	height:auto;
	margin-left:0%;
	}



/* NEWS */

#news #tln_title,#blog #tln_title {
	float:none;
	width:50%;
	height:auto;
}

#news ul,#blog ul {
	float:none;
	width:100%;
	margin-bottom:35px;
}


#news ul li,#blog ul li {
	line-height:2.5;
	padding-bottom:10px;
}

#news ul li span,#blog ul li span {
	margin-right:0;
	display:block;
}

}

@media screen and (min-width:600px) and ( max-width:960px) {
main h1 {
	font-size:25px;
}

.fadein {
	font-size:25px;
	margin-top:-180px;
	margin-bottom:100px;
}
#messe h1 img{
	width:60%;
	height:auto;
	left: 31%;
	}
#messe .maruimg img{
	width:20%;
	height:auto;
	top: -13%;
	left: 9%;
	}
#content1 ul {
  	margin-left:0;
}
#messe .container img{
	width:95%;
	height:auto;
	}
#content2 ul li{
	width: auto;
}
#content2 ul .consul{
	left:65%;
	}
#content2 ul li img{
	left:4%;
    top: 82%;
    width: 42%;
    height: auto;
	}
#content2{
	padding:14px;
	}
	
#content2 p {
    font-size: 1.3em;
    width: 100%;
}

/*#proposal {
	padding:50px 15px 70px 15px;
}*/

#news ul li {
	line-height:2.5;
	padding-bottom:10px;
}

#news ul li span {
	margin-right:0;
	display:block;
}

/*.inner {
	width:96%;
}*/

#content1 ul h1,
/*#content1 ul .ptext*/ {
	padding:0 20px;
	margin-top:0;
}


/*#content1 ul .w_img1 img,
#content1 ul .w_img4 img {
	width:100%;
	background-color:#f6fbff;
	margin:0;
}

#content1 ul .w_img2,
#content1 ul .w_img3 {
	padding:20px 0;
}

.age_waku {
	bottom:20px;
	right:20px;
}
*/
}

@media screen and (min-width:960px) and ( max-width:1280px) {
.fadein {
	margin-top:-250px;
	margin-bottom:150px;
}
#content1 ul {
	margin-left:0;
    
}
#content2 ul li img {
    left: 0%;
}

}