@charset "utf-8";
/* ----------------------------------
メディアクエリ　モバイルレイアウト : 480pxまで
----------------------------------- */

#contentsWrapper{
margin-top: 15px;
}
#visual{
padding:0 10px;
width:100%;
}
#aboutMRC{
margin: 0 auto 10px;
overflow: hidden;
padding:10px;
background-color: #efefeb;
}
#aboutMRC dl{
margin: 0 auto;
width: 100%;
}
#aboutMRC dl dd{
min-height: 150px;
}
#aboutMRC dl:first-child{
background:#fff url(../../images/aboutmrc_pict_01.png) no-repeat 50% 50%;
-moz-background-size:64px auto;
-webkit-background-size:64px auto;
background-size:64px auto;
}
#aboutMRC dl:last-child{
background:#fff url(../../images/aboutmrc_pict_02.png) no-repeat 50% 50%;
-moz-background-size:61px auto;
-webkit-background-size:61px auto;
background-size:61px auto;
}
#aboutMRC dt{
text-align: center;
padding: 12px 10px;
font-size:16px;
font-weight: bold;
border-top:#494949 solid 3px;
border-bottom:#494949 solid 3px;
background: #fff;
}
#aboutMRC dd{
padding:20px;
line-height: 1.8;
font-size:11px;
}
#aboutMRC ul{
margin-top:1em;
list-style-type:none;
}
#aboutMRC ul li{
margin-top:0.35em;
padding-left: 1.5em;
position: relative;
}
#aboutMRC ul li::before{
position: absolute;
left:0;
top:0;
content:'・';
}
#aboutMRC ol{
list-style-type:none;
counter-reset: li;
}
#aboutMRC ol li{
margin-top:0.35em;
padding-left: 1.5em;
position: relative;
}
#aboutMRC ol li::before{
position: absolute;
left: 0;
display: block;
content:  counter(li) ".";
counter-increment: li;
}
#aboutMRC .rmark{
margin-top:0.5em;
font-size:clamp(12px, 1.4vw, 14px);
}
.scrollBox01,
.scrollBox02{
overflow: hidden;
}
/*
.scrollBox01{
height:300px;
}
.scrollBox02{
height:240px;
}
*/
.scrollBox01{
height:240px;
}

.scrollBox02{
height:200px;
}

.information{
padding:10px;
background-color: #efefeb;
}
#recruit .ttlWrap{
display:table;
width: 100%;
background: url(../images/ttlhome_bg.png) repeat left top;
}
#seminar .ttlWrap{
display:table;
width: 100%;
background: url(../images/ttlhome_bg_02.png) repeat left top;
}
.information .ttlWrap .ttlHome,
.information .ttlWrap .btnList{
display: table-cell;
vertical-align: middle;
}
.information .ttlWrap .ttlHome{
padding:10px 14px;
color: #fff;
font-size: 16px;
line-height: 1.2;
font-weight: normal;
text-align: left;
}
.information .ttlWrap .btnList{
width: 100px;
text-align: center;
color:#ffffff !important;
text-decoration: none;
font-size: 12px;
line-height: 1;
position: relative;
}
.information .ttlWrap .btnList span{
display: inline-block;
position: relative;
padding-right: 20px;
}
.information .ttlWrap .btnList span::after{
content: '';
width: 6px;
height: 6px;
border-right: #fff solid 2px;
border-top:#fff solid 2px;
transform: rotate(45deg) translateY(-50%);
position: absolute;
display: block;
right:7.5px;
top:47.5%;
}
.information .ttlWrap .btnList:hover{
text-decoration: none;
}
#recruit .ttlWrap .ttlHome{
border-right:#178e7b solid 1px;
}
#recruit .ttlWrap .btnList{
border-left:#4cc1af solid 2px;
background: url(../images/information_btn_bg.png) no-repeat left top;
}
#recruit .ttlWrap .btnList:hover{
background: url(../images/information_btn_bg_o.png) no-repeat left top;
}
.informationWrap{
width:100%;
}
.information ul{
margin: 0;
padding: 0;
list-style-type: none;
background: #fff;
}
.information li{
margin:0;
padding:10px 14px;
font-size:10px;
line-height: 1.6;
border-top:1px solid #d6d6d6;
}
.information li:first-child{
border-top:none;
}
.information .icon{
overflow: hidden;
}
.information .icon span{
margin-bottom:4px;
display: block;
float: left;
padding:4px 8px;
margin-right: 5px;
font-size: 8px;
white-space: nowrap;
line-height: 1;
color:#ffffff;
text-align: center;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
}
#recruit .icon span{
background: #49d0ac;
}
#seminar .icon span{
background: #51bee5;
}
.iphone .information .icon span{
padding-top:2px;
}
.information .txt{
font-size: 10px;
font-weight:bold;
line-height: 1.6;
color:#1e1e1e;
}
.information .txt a{
color:#000000 !important;
text-decoration: none;
}
.information .anchor{
cursor: pointer;
}
.information .anchor:hover{
text-decoration: underline;
}



/* ----------------------------------
メディアクエリ　タブレットレイアウト : 481px　〜
----------------------------------- */
@media only screen and (min-width: 481px) {


#visual{
padding:0;
width:100%;
}
#contentsWrapper{
margin-top: 10px;
}

#aboutMRC{
margin: 0 auto 0;
padding:20px 20px 0;
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 20px 1fr;
grid-template-columns: repeat(2, 1fr);
gap: 0 10px;
justify-content: center;
}
#aboutMRC dl{
height: 100%;
align-items: stretch;
background-color: #fff;
}
#aboutMRC dl dd{
min-height: 250px;
}
#aboutMRC dl:first-child{
background:#fff url(../../images/aboutmrc_pict_01.png) no-repeat 50% 60%;
-moz-background-size:128px auto;
-webkit-background-size:128px auto;
background-size:128px auto;
}
#aboutMRC dl:last-child{
background:#fff url(../../images/aboutmrc_pict_02.png) no-repeat 50% 60%;
-moz-background-size:122px auto;
-webkit-background-size:122px auto;
background-size:122px auto;
}
#aboutMRC dt{
text-align: center;
padding: 10px;
font-size:16px;
font-weight: bold;
border-top:#494949 solid 3px;
border-bottom:#494949 solid 3px;
}
#aboutMRC dd{
padding:20px;
line-height: 1.8;
font-size:14px;
}
#aboutMRC ul{
margin-top:1em;
list-style-type:none;
}



#recruit{
padding:20px;
}
.information .ttlWrap .ttlHome{
padding:10px 14px;
font-size: 22px;
}
.information .ttlWrap .btnList{
width: 100px;
font-size: 14px;
line-height: 1.2;
position: relative;
}
.information li{
font-size:12px;
}
.information .icon span{
font-size: 10px;
}
.information .txt{
font-size: 12px;
line-height:1.4;
}

}

/* ----------------------------------
メディアクエリ　デスクトップレイアウト : 769px　〜
----------------------------------- */
@media only screen and (min-width: 769px) {

#contentsArea{
width: 100%;
}
#aboutMRC dt{
font-size:22px;
}
#aboutMRC dd{
padding-left: 50px;
padding-right: 50px;
font-size:16px;
}
.information li{
font-size:14px;
}
.information .txt{
font-size: 14px;
}
.information .ttlWrap .btnList{
font-size: 15px;
width: 125px;
}

}



/* blogArea
------------------------------------------------------------------------------------------------------------- */
#blogArea_new{
padding: 0 10px 10px;
position: relative;
width: 100%;
background: #efefeb;
}
.blogArea_ttlWrap{
margin-bottom:10px;
background: #2db5c8 url(../images/ttlhome_bg_blog.png) repeat left top;
color:#fff;
display: table;
width: 100%;
}
.blogArea_ttlWrap .blogArea_ttlWrap_ttl,
.blogArea_ttlWrap .blogArea_ttlWrap_btn{
display: table-cell;
vertical-align: middle;
}

.blogArea_ttlWrap_ttl{
padding:10px 14px;
color: #fff;
font-size: 16px;
line-height: 1.2;
font-weight: normal;
text-align: left;
border-right:#1a8d9e solid 1px;
}
.blogArea_ttlWrap_btn{
width: 100px;
text-align: center;
color:#ffffff !important;
text-decoration: none;
font-size: 12px;
line-height: 1;
position: relative;
border-left:#52c1d2 solid 2px;
}
.blogArea_ttlWrap_btn span{
display: inline-block;
position: relative;
padding-right: 20px;
}
.blogArea_ttlWrap_btn span::after{
content: '';
width: 6px;
height: 6px;
border-right: #fff solid 2px;
border-top:#fff solid 2px;
transform: rotate(45deg) translateY(-50%);
position: absolute;
display: block;
right:7.5px;
top:47.5%;
}
.blogArea_ttlWrap_btn:hover{
text-decoration: none;
}

.blogArea_ttlWrap .blogArea_ttlWrap_btn:hover{
background: url(../images/ttlhome_bg_blog_btn_bg_o.png) no-repeat left top;
text-decoration: none;
}
#blogArea_new {
list-style-type: none;
}
.blogLists{
width: 100%;
display: grid;
gap:20px;
list-style: none;
}
.blogLists li{
display: inline-block;
vertical-align: top;
background: #fff;
font-size: 12px;
line-height: 1.5;
text-align: center;
position: relative;
padding-bottom:50px;
white-space: normal;
}
.blogLists .inner{
padding: 15px;
}
.blogLists figure{
display: block;
aspect-ratio: 5 / 3.35;
margin-bottom:15px;
}
.blogLists img{
width: 100%;
height: 100%;
object-fit: cover;
transition: 0.3s;
}
.blogLists h3{
text-align: center;
font-size: 16px;
line-height: 1.5;
font-weight: bold;
text-decoration: none;
color:#000;
text-align: left;
margin-top:0.25em;
}
.blogLists time{
font-size: 11px;
color:#000;
display: block;
text-align: left;
}
.blogLists .inner > a{
color:#000;
text-decoration: none;
}
.blogLists .inner > a:hover h3{
color:#666 !important;
text-decoration: underline;
}
.blogLists .inner > a:hover img{
opacity: 0.6;
}
.blogLists p{
margin-top:0.5em;
text-align: left;
font-size:13px;
}
.blogLists .btn{
position: absolute;
bottom: 10px;
width: 100%;
left: 0;
text-align: center;
}
.blogLists .btn a{
display: inline-block;
font-size: 14px;
text-align: left;
overflow: hidden;
text-indent: 200%;
width: 40px;
height: 40px;
color: #fff;
white-space: nowrap;
text-decoration: underline;
-webkit-transition: 0.3s ease;
-moz-transition: 0.3s ease;
-o-transition: 0.3s ease;
transition: 0.3s ease;
border-radius: 50px;
background:#20b0c5 url('data:image/svg+xml;charset=utf8,%3Csvg%20enable-background%3D%22new%200%200%2032%2032%22%20viewBox%3D%220%200%2032%2032%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-linecap%3D%22round%22%20stroke-miterlimit%3D%2210%22%20stroke-width%3D%222%22%3E%3Cpath%20d%3D%22m16%202%2014%2014-14%2014%22%2F%3E%3Cpath%20d%3D%22m2.76602%2016h27.23398%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E') no-repeat center center / 18px 18px;

}
.blogLists .btn a:hover{
background-color: #1d9eb2;
}
@media only screen and (min-width: 481px) {
    .blogArea_ttlWrap_ttl{
        padding:10px 14px;
        font-size: 22px;
    }
    #blogArea_new{
        padding: 0 20px 20px;
    }
    .blogLists{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap:0 5px;
    }
    .blogLists p{
        font-size: 14px;
    }
    .information .ttlWrap .btnList{
    font-size: 15px;
    width: 125px;
    }
}
@media (min-width: 769px) {
    .blogArea_ttlWrap_ttl{
        padding:10px 14px;
        font-size: 22px;
    }
    .blogLists{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap:0 10px;
    }
    .blogArea_ttlWrap_btn{
    font-size: 15px;
    width: 125px;
    }
}
