@charset 'utf-8';


.h1_wrap { position:relative; }
.h1_wrap .line { display:none; }
@media screen and (min-width: 840px) {
  .h1_wrap .line { display:none; }
  .h1_wrap { margin-bottom:100px; }

}

/*フッター*/
.footer_link a.f_concept:visited {text-decoration:underline;}
.footer_link a.f_concept:link {text-decoration:underline;}

#main { position:relative; }
#main .contents { width:70%; margin:0 auto 0px auto; display:flex;flex-wrap:wrap; }
.lead { font-size:1.5rem; font-family:"Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "小塚明朝 Pro EL", "Kozuka Mincho Pro", Century, "Times New Roman", Times, "ＭＳ 明朝", serif;}
#main .contents { width:90%; margin:0 auto; text-align:center;  position:relative; padding:30px 0px 0px 0px; display:block;}

#main .main_in { width:90%; display:flex; margin:0 5% 50px 5%; flex-wrap:wrap; }

@media screen and (min-width: 840px) and (max-width: 1120px) {
  #main .main_in { width:90%; margin:0 auto 100px auto; overflow:visible;}
}

@media screen and (min-width: 1120px) {
  #main .main_in { width:1080px; margin:0 auto 100px auto; overflow:visible;}
}

#main .main_in_right { width:100%; margin-top:20px; }
#main .main_in_right img { width:100%; margin:0 0 30px 0;}
@media screen and (max-width: 320px) {
  #main .main_in_right p { width:100%; display:inline-block; font-size:14px; }
}

#main .main_in_right p { width:100%; display:inline-block; font-size:15px; }
#main .main_in_right img.pc_family { display:none; }
#main .main_in_left img.sp_family { display:block; }
@media screen and (min-width: 840px) and (min-width: 1120px){
  #main .main_in_right { width:50%; text-align:left; overflow:visible;}
  #main .main_in_right img.pc_family { width:100%; max-width:740px; margin:0 0 30px 0; display:block; }
  #main .main_in_left img.sp_family { display:none; }
  #main .main_in_right p { width:100%; display:inline-block; font-size:15px; letter-spacing:0.15; line-height:2; }
}
@media screen and (min-width: 1120px) {
  #main .main_in_right img.pc_family { width:740px; margin:0 0 30px 0; display:block; }
  #main .main_in_left img.sp_family { display:none; }
}


.main_in_left { width:100%; margin:0 0 0 0%; position:relative;  }
.main_in_left strong { width:100%; display:inline-block; font-size:20px; line-height:1.7em;letter-spacing: 0.1em; margin-bottom:50px; text-align:center; }
@media screen and (min-width: 1120px) {
  .main_in_left strong { font-size:20px; text-align:left; }
}
.main_in_left img { width:100%; }
.main_in_left img.img_sekkei { display:none;}
.line_color { width:20%; position:absolute; top:32%; right:0; z-index:5;}

@media screen and (min-width: 840px) and (max-width: 1120px){
  .main_in_left { width:100%; margin:0 0 0 0%; font-size:24px; }
  .main_in_left img.img_sekkei { display:none;}
  .main_in_left strong br.pc { display:none; }
  .main_in_left strong br.pad { display:inline-block; }
}
@media screen and (min-width: 1120px) {
  .main_in_left { width:45%; margin:0 0 0 0%; font-size:24px; }
  .main_in_left strong { margin-bottom:70px; line-height:53px; }
  .main_in_left strong br.pc { display:inline-block; }
  .main_in_left strong br.pad { display:none;}
  .main_in_left img.img_sekkei { width:440px; display:block;}
  .line_color { width:300px; position:absolute; top:29%; left:0; z-index:5;}
}

h1:before {background-color:#C5CE2B; /*下線の色*/}
h2:before {background-color:#C5CE2B; /*下線の色*/ left:25%; }

.graybox { position:relative; }
.graybox .lead { width:100%; text-align:center; font-size:2rem; letter-spacing:0.1em; font-family:"Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "小塚明朝 Pro EL", "Kozuka Mincho Pro", Century, "Times New Roman", Times, "ＭＳ 明朝", serif; }
.graybox { padding:50px 0;}

/*メッセージ*/
.message .h2_wrap { text-align:left; margin:0 0 30px 0; }
.message .h2_wrap h2 { width:100%; text-align:center; display:inline-block; font-size:18px; }
.message .h2_wrap h2:before {background-color: #C5CE2B; /*下線の色*/ left:50%; bottom:-28px; }
@media screen and (min-width: 840px) {
  .message .h2_wrap { margin-bottom:50px; }
  .message .h2_wrap h2 { width:100%; text-align:left; display:inline-block; font-size:18px; }
  .message .h2_wrap h2:before {left:5%;}
}

.message { width:90%; display:block; margin:0 auto; }
.message div img { width:100%; }
.message_left .ceo { width:100%; margin-top:50px; }
.message_right strong small { width:100%; font-size:14px; display:inline-block;margin-bottom:10px; font-family:'メイリオ',Verdana,"ＭＳ Ｐゴシック","ヒラギノ角ゴ Pro W3",Arial,Helvetica,sans-serif;}
.message_right strong { width:100%; display:inline-block; font-size:20px; line-height:1.7em; letter-spacing: 0.1em;  margin-bottom:30px; font-family:"Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "小塚明朝 Pro EL", "Kozuka Mincho Pro", Century, "Times New Roman", Times, "ＭＳ 明朝", serif; font-weight:normal; }

@media screen and (min-width: 840px) {
  .message_right strong small { margin-bottom:10px;}
  .message_right strong { margin-bottom:30px;}
}

.katagaki { width:100%; text-align:right; font-weight:normal; margin:30px 0 50px 0;display:block; }
.message_right p.mincho { font-size:15px; }


@media screen and (max-width: 320px) {
  .message_right .span_message { width:100%; font-size:14px; margin-bottom:50px; line-height:2em; display:inline-block; font-family:"Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "小塚明朝 Pro EL", "Kozuka Mincho Pro", Century, "Times New Roman", Times, "ＭＳ 明朝", serif; font-weight:normal; }

}
@media screen and (min-width: 320px) and (max-width: 374px){
  .message_right .span_message { width:100%; font-size:14px; margin-bottom:50px; line-height:2em; display:inline-block; font-family:"Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "小塚明朝 Pro EL", "Kozuka Mincho Pro", Century, "Times New Roman", Times, "ＭＳ 明朝", serif; font-weight:normal; }

}

@media screen and (min-width: 375px) {
  .message_right .span_message { width:100%; font-size:17px; margin-bottom:50px; line-height:2em; display:inline-block; font-family:"Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "小塚明朝 Pro EL", "Kozuka Mincho Pro", Century, "Times New Roman", Times, "ＭＳ 明朝", serif; font-weight:normal; }

}

@media screen and (min-width: 840px) and (max-width:1120px){
  .message div.h2_wrap { text-align:left; margin-bottom:0; margin-left:0%; margin-top:30px; overflow:visible; position:relative;}
  .graybox { padding:100px 0 100px 0;}
  .message { width:90%; display:flex; margin:0 auto; }
  .message_left { width:40%; text-align:left; } 
  .message_left .ceo { width:95%; margin:100px 5% 30px 0; position:absolute; right:0px; }
  .message_right { width:60%; text-align:left; } 
  .message_right strong  { font-size:26px; }
  .message_right strong br.sp { display:none;}
  .message_right strong .pad { display:inline-block;}  
  .message_right p { font-size:15px; line-height:2; }
  .katagaki { width:87%; text-align:right; font-weight:normal; margin-top:30px; display:block; }
}
@media screen and (min-width: 1120px) {
  .graybox { padding:100px 0 100px 0;}
  .message { width:1080px; display:flex; margin:0 auto; justify-content: space-between;}
  .message_left { width:45%; text-align:left; } 
  .message_right { width:55%; text-align:left; } 
  .message_left .ceo { width:660px; margin:250px 50px 30px 0; position:absolute; right:0% }
  .message_right strong .pad { display:none; }
  .message_right strong { width:100%; display:inline-block; font-size:26px; line-height:1.7em; letter-spacing: 0.1em;  margin-bottom:30px; font-family:"Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3", "小塚明朝 Pro EL", "Kozuka Mincho Pro", Century, "Times New Roman", Times, "ＭＳ 明朝", serif; font-weight:normal; }
  .message_right strong br.sp { display:none; }
}



#main { position:relative; overflow: hidden;}

#main .border_right {position: absolute;width: 250px;height:250px;overflow: hidden;/*  background: #000; */right:-7%;top:3%; z-index:1;transform:rotate(135deg); }
#main .border_right2 {position: absolute;width: 292px;height:292px;overflow: hidden;/*  background: #000; */right:-5%;top:3%; z-index:1;transform:rotate(135deg); }
#main .border_right2 .left-to-right.red {bottom: 20%;border-left-color: #FCA528;transform: rotate(0);animation: left-to-right-anim 1s linear forwards;}
#main .border_right2 .left-to-right.red::before {background: #FCA528;}

@media screen and (min-width: 840px) and (max-width: 1120px){
/*右側の斜め線*/
#main .border_right {position: absolute;width: 250px;height:250px;overflow: hidden;/*  background: #000; */right:-7%;top:48%; z-index:10;transform:rotate(135deg); }
#main .border_right2 {position: absolute;width: 292px;height:292px;overflow: hidden;/*  background: #000; */right:-5%;top:48%; z-index:10;transform:rotate(135deg); }
}