@charset "utf-8";

@media screen and (max-width:1023px)  {
#pan {
padding-top: 30px;
}
}


#sub_ttl{
width:100%;
background-color:#8ed2f3;
color:#fff;
text-align:center;
font-weight:800;
font-size:32px;
padding:15px;
font-family: "M PLUS Rounded 1c";
margin-top:50px;
position: relative;
}
.sub_ttl_en{
font-size:21px;
font-weight:600;
}


@media screen and (max-width:1023px)  {
#sub_ttl{
margin-top:180px;
}
}
@media screen and (max-width:680px)  {
#sub_ttl{
font-size:26px;
margin-top:30px;
}
}
@media screen and (max-width:480px)  {
#sub_ttl{
margin-top:30px;
font-size:22px;
line-height:1.5;
}
.sub_ttl_en{
font-size:15px;
}
}

#sub_ttl:after{
display: block;
content: "";
position: absolute;
bottom: -60px;
left: 50%;
width: 2px;
height: 38px;
background-color: #409fc6;
}

/* ---------------------------------- */

#consul_about{
background-color:#f1f8fb;
padding:100px 0 100px;
text-align:center;
}
@media screen and (max-width:680px)  {
#consul_about{
padding:80px 0;
}
}

#consul_about_text{
max-width:900px;
width:86%;
margin:0 auto;
text-align:left;
letter-spacing: 0.5px;
line-height:2.0;
max-height: 100%;
}


/* ---------------------------------- */

#service{
width:100%;
padding:40px 0 100px;
text-align:center;
}
@media screen and (max-width:680px)  {
#service{
padding:80px 0;
}
}

#service_inner{
max-width:960px;
width:86%;
margin:0 auto;
}

#service_text{
text-align:left;
max-width:630px;
width:100%;
margin:0 auto 70px;
}

#service_text ul{
padding:0 15px;
}
@media screen and (max-width:480px)  {
#service_text ul{
padding:0;
}
}

#service_text li {
background-image: url(../images/common/ico_check.png);
background-size: 18px;
background-repeat: no-repeat;
padding-left: 27px;
background-position: 0px 9px;
margin-bottom:8px;
}


#service_text_en{
/* background-color:#fff;
border:#a7d8ec solid 1px; */
padding:42px 30px;
word-wrap: break-word;
word-break: keep-all;
letter-spacing:0.5px;
text-align:left;
}

#service_text_en h3{
font-size: 30px;
color: #409fc6;
font-weight: 800;
font-family: "M PLUS Rounded 1c";
text-align: center;
}
@media screen and (max-width:680px)  {
#service_text_en{
padding:0;
}
#service_text_en h3{
font-size: 26px;
line-height:1.5;
}
}

#link{
max-width:652px;
width:86%;
margin:0 auto;
padding:90px 0 120px;
text-align:center;
}
@media screen and (max-width:680px)  {
#link{
padding:70px 0 100px;
}
}

#link_box{
border:#bad0d9 solid 1px;
padding:32px 70px;
text-align:left;
}
@media screen and (max-width:680px)  {
#link_box{
padding:10% 8%;
}
}

#link_box li{
background-image: url(../images/consulting/ico_clip.png);
background-size: 26px;
background-repeat: no-repeat;
padding-left: 45px;
background-position: 0px 7px;
}

#link_box li a{
text-decoration:none;
color:#444;
}
#link_box li a:hover{
text-decoration:underline;
}
@media screen and (max-width:680px)  {
#link_box li{
background-size:20px;
padding-left:35px;
}
#link_box li a{
}
}

/*　書籍--------------------------------- */

.books_list{
text-align:center;
max-width:1140px;
width:90%;
margin:80px auto 100px;
}

.books_list a{
text-decoration: none;
color:#444;
}

ul.books{
overflow: hidden;
width: 100%;
display: -webkit-box;
display: -moz-box;
display: -ms-box;
display: -webkit-flexbox;
display: -moz-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: flex;
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}

@media screen and (max-width:480px)  {
ul.books{
display: block;
}
}

ul.books li{
position: relative;
max-width:550px;
width: calc( 50% - 20px ) ;
margin-bottom: 70px;
text-align: center;
overflow: hidden;
}
ul.books li:nth-child(2n+1){
margin-right:40px;
}
@media screen and (max-width:920px)  {
ul.books li{
width: 100%;
max-width:680px;
margin:0 auto 60px;
}
ul.books li:nth-child(2n+1){
margin-right:0;
width: 100%;
max-width:680px;
margin:0 auto 60px;
}
}
@media screen and (max-width:480px)  {
ul.books li,
ul.books li:nth-child(2n+1){
text-align: center;
}
}



.books_img{
float: left;
width: 196px;
}
@media screen and (max-width:480px)  {
.books_img{
float:none;
margin:0 auto 15px;
}
}

.books_img img.b_img{
width:100%;
height:auto;
border:#ccc solid 1px;
}

.books_text{
float: right;
width: calc( 100% - 216px ) ;
text-align: left;
padding-top:8px;
}
@media screen and (max-width:480px)  {
.books_text{
float:none;
width:86%;
margin:0 auto;
}
}

.books_ttl{
margin-bottom:15px;
font-weight:500;
}

.books_info{

}