@charset "utf-8";
.font_0C497C{
    color: #0C497C;
}
.font_bold {
    font-weight: 700;
}


/* ====================
    背景色
======================*/
.bg_white {
    background: #FFF;
}
.bg_pink{
    background: #FFECEE;
}
.bg_green{
    background: #ECF8E4;
}
.bg_sky{
    background-image: url(../img/feature/bg_01.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
}
/* ====================
    タイトル
======================*/
.common_headline1 {
    width: 100%;
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    border-bottom: 1px solid #E3E3E3;
    border-top: 1px solid #E3E3E3;
    padding-top: 12px;
    padding-bottom: 12px;
}
@media screen and (min-width: 768px) {
.common_headline1 {
    font-size: 30px;
    border-top: 1px solid #FFF;
    padding-top: 34px;
    padding-bottom: 34px;
}
}
.common_headline2 {
    font-size: 22px;
    font-weight: 200;
    color: #0C497C;
    line-height: 150%;
}
@media screen and (min-width: 768px) {
.common_headline2 {
    font-size: 36px;
}
}
/* ====================
   在校生･卒業生の声
======================*/
.voice_list_box {
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
}
@media screen and (min-width: 768px) {
.voice_list_box {
    width: 1080px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 80px;
    padding-bottom: 80px;
}
}

.voice_title_box {
    text-align: center;
}
@media screen and (min-width: 768px) {
.voice_title_box {
    padding-top: 0px;
    padding-bottom: 20px;
    text-align: center;
}
}
.voice_sub_title{
    padding-bottom: 0px;
}
@media screen and (min-width: 768px) {
.voice_sub_title{
    padding-bottom: 20px;
}
}
.school_bottom{
    padding-bottom: 10px;
}
@media screen and (min-width: 768px) {
.school_bottom{
    padding-bottom: 20px;
}
}
.voice_data_box {
    margin-top: 20px;
    margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
.voice_data_box {
    margin-top: 40px;
    margin-bottom: 40px;
}
}
.voice_data_box img {
    width: 100%;
}
@media screen and (min-width: 768px) {
.voice_data_box img {
    width: 530px;
    height: 400px;
}
}
.voice_data_box a{
    width: 100%;
    display: block;
}
@media screen and (min-width: 768px) {
.voice_data_box a{
    width: 530px;
    transition: 0.3s;
}
}
.voice_student_btn {
    display: block;
    line-height: 150%;
    text-align: center;
    background-color: #FF7D87;
    color: #FFF;
    width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    text-decoration: none;
}
@media screen and (min-width: 768px) {
.voice_student_btn {
    height: 100px;
    line-height: 100px;
    font-size: 22px;
    transition: 0.3s;
    padding: 0;
}
}
@media screen and (min-width: 768px) {
div.voice_data_box a {
    color: #FFF;
    text-decoration: none;
    transition: 0.3s;
}
}
div.voice_data_box a:hover .voice_student_btn {
    background-color: #f49198;
    text-decoration: none;
}
@media screen and (min-width: 768px) {
div.voice_data_box a:hover .voice_student_btn {
    background-color: #f49198;
    text-decoration: none;
}
}
@media screen and (min-width: 768px) {
div.voice_data_box a:hover img{
    opacity: 0.8;
}
}
.voice_graduate_btn {
    display: block;
    line-height: 150%;
    text-align: center;
    background-color: #53992D;
    color: #FFF;
    width: 100%;
    font-size: 13px;
    padding-top: 8px;
    padding-bottom: 8px;
}
@media screen and (min-width: 768px) {
.voice_graduate_btn {
    height: 100px;
    line-height: 100px;
    font-size: 22px;
    transition: 0.3s;
    padding: 0;
}
}
@media screen and (min-width: 768px) {
div.voice_data_box a:hover .voice_graduate_btn {
    background-color: #75AD56;
    text-decoration: none;
}
}
/* ====================
    在校生・卒業生の声
======================*/
#no01,
#no02,
#no03,
#no04,
#no05,
#no06,
#no07,
#no08,
#no09 {
  margin-top: -60px;
  padding-top: 60px;
}
@media screen and (min-width: 768px) {
  #no01,
  #no02,
  #no03,
  #no04,
  #no05,
  #no06,
  #no07,
  #no08,
  #no09 {
    margin-top: -130px;
    padding-top: 130px;
  }
}
.voice_sg_box {
    padding-top: 20px;
    padding-bottom: 30px;
    margin-right: 5px;
    margin-left: 5px;
}
@media screen and (min-width: 768px) {
.voice_sg_box {
    width: 1080px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 80px;
    padding-top: 80px;
}
}

.voice_sg_tbl{
    width: 100%;
}
@media screen and (min-width: 768px) {
.voice_sg_tbl{
    width: 630px;
    float: left;
}
}
.voice_sg_photo {
    width: 90%;
    text-align: center;
    padding-top: 20px;
    margin-left: auto;
    margin-right: auto;
}
@media screen and (min-width: 768px) {
.voice_sg_photo {
    width: 390px;
    float: right;
    padding-top: 0px;
    margin: 0;
}
}
.voice_sg_title {
    font-size: 22px;
    padding-bottom: 10px;
}
@media screen and (min-width: 768px) {
.voice_sg_title {
    font-size: 32px;
    padding-bottom: 30px;
}
}
.voice_student_name {
    font-weight: 500;
    padding-bottom: 5px;
}
@media screen and (min-width: 768px) {
.voice_student_name {
    padding-bottom: 10px;
}
}
.voice_student_name_sp {
    margin-top: 8px;
}
@media screen and (min-width: 768px) {
    .voice_student_name_sp {
    margin-top: 0px;
}
}
.voice_graduate_name {
    font-weight: 500;
    font-size: 18px;
    padding-bottom: 5px;
}
@media screen and (min-width: 768px) {
.voice_graduate_name {
    font-size: 20px;
    padding-bottom: 10px;
}
}
.voice_graduation_year {
    font-weight: 500;
    padding-bottom: 5px;
}
@media screen and (min-width: 768px) {
.voice_graduation_year {
    padding-bottom: 10px;
}
}
.voice_company_name {
    font-weight: 500;
    padding-bottom: 10px;
}
@media screen and (min-width: 768px) {
.voice_company_name {
    padding-bottom: 30px;
}
}
@media screen and (min-width: 768px) {
.voice_sg_txt {
    line-height: 200%;
}
}
.voice_sg_while{
    margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
.voice_sg_while{
    margin-bottom: 30px;
}
}