@charset "UTF-8";

h3.con-title { position: relative; margin-bottom: 2rem; font-size: 3rem; font-weight: 800; }

#sec01 { padding: 3.6rem 0 5rem; }
#sec01 .con-title { padding-top: 3rem; margin-bottom: 4rem; text-align: center; }
#sec01 .con-title::before { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 4.4rem; height: 1rem; background: url(../images/title-obj.png) no-repeat center / contain; content: ""; }
#sec01 .sec01-wrap .sec01-item { display: flex; align-items: center; }
#sec01 .sec01-wrap .sec01-item.reverse { flex-direction: row-reverse; margin-top: 3.6rem; }
#sec01 .sec01-wrap .sec01-item .img { flex-shrink: 0; width: 37rem; height: 25rem; overflow: hidden; margin-right: 6rem; border-radius: 2rem; }
#sec01 .sec01-wrap .sec01-item .img>img { width: 100%; height: 100%; object-fit: cover; }
#sec01 .sec01-wrap .sec01-item.reverse .img { margin-left: 5rem; margin-right: 0; }
#sec01 .sec01-wrap .sec01-item .con h4 { margin-bottom: 1rem; font-size: 2.2rem; font-weight: 700; line-height: 3rem; }
#sec01 .sec01-wrap .sec01-item:hover .con h4 { text-decoration: underline; text-underline-position: under; } 
#sec01 .sec01-wrap .sec01-item .con p { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; font-size: 1.6rem; line-height: 2.4rem; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
#sec01 .sec01-wrap .sec01-item .con .more { display: inline-block; margin-top: 3rem; font-size: 1.4rem; font-weight: 900; text-decoration: underline; text-underline-position: under; }

@media (max-width: 860px) {
  #sec01 .sec01-wrap .sec01-item .img { width: 30rem; height: 20rem; margin-right: 4rem; }
  #sec01 .sec01-wrap .sec01-item.reverse .img { margin-left: 4rem; }
}

@media (max-width: 640px) {
  #sec01 .sec01-wrap .sec01-item { display: block; }
  #sec01 .sec01-wrap .sec01-item .img { width: 100%; height: 22rem; margin: 0 auto 2rem !important; }
  #sec01 .sec01-wrap .sec01-item .con .more { margin-top: 2rem; }
  #sec01 .sec01-wrap .sec01-item.reverse { margin-top: 4rem; }
}


#sec02 { padding: 4rem 0 5rem; background-color: #f4f4f4; }
#sec02 .sec02-wrap { display: flex; }
#sec02 .sec02-wrap .sec02-item { display: flex; flex-direction: column; width: calc(50% - 1.4rem); margin-right: 2.8rem; }
#sec02 .sec02-wrap .sec02-item:last-child { margin-right: 0; }
#sec02 .sec02-wrap .sec02-item>a { display: flex; flex-direction: column; height: 100%; overflow: hidden; border-radius: 2rem; transition: .24s; }
#sec02 .sec02-wrap .sec02-item>a:hover { box-shadow: .4rem .4rem 1.4rem rgba(0, 0, 0, .1); }
#sec02 .sec02-wrap .sec02-item .img { position: relative; height: 20rem; }
#sec02 .sec02-wrap .sec02-item .img>img { width: 100%; height: 100%; object-fit: cover; }
#sec02 .sec02-wrap .sec02-item .img.people { display: flex; flex-direction: column; justify-content: flex-end; padding: 1.8rem 3.2rem; background: url(../images/focus-bg.png) no-repeat center / cover; }
#sec02 .sec02-wrap .sec02-item .img::before { position: absolute; top: 2.4rem; right: 2.4rem; width: 4.6rem; height: 4.6rem; border-radius: 50%; background-color: rgba(255, 255, 255, .6); font-family: 'xeicon'; font-size: 2rem; color: #000; line-height: 4.6rem; text-align: center; transition: .24s; content: "\e9c5"; }
#sec02 .sec02-wrap .sec02-item>a:hover .img::before { background-color: rgba(255, 255, 255, .8); }
#sec02 .sec02-wrap .sec02-item .title { flex-grow: 1; padding: 2.6rem 3rem 3.4rem; background-color: #fff; font-size: 2.2rem; font-weight: 700; line-height: 3rem; }
#sec02 .sec02-wrap .sec02-item .img.people .name { margin-top: 1.4rem; font-size: 1.55rem; color: #fff; }
#sec02 .sec02-wrap .sec02-item .img.people .name>i { font-size: 1.9rem; vertical-align: middle; }
#sec02 .sec02-wrap .sec02-item .img.people .name>span { margin-right: 1rem; }

@media (max-width: 640px) {
  #sec02 .con-title { text-align: center; }
  #sec02 .sec02-wrap { display: block; }
  #sec02 .sec02-wrap .sec02-item { width: 100%; margin-bottom: 4rem; margin-right: 0; }
  #sec02 .sec02-wrap .sec02-item:last-child { margin-bottom: 0; }
  #sec02 .sec02-wrap .sec02-item .img { height: 22rem; }
}


/* sec03 */
#sec03 { padding: 5rem 0 7rem; }
#sec03 .sec03-wrap { display: flex; }
#sec03 .sec03-wrap .sec03-item { width: calc(50% - 1.4rem); margin-right: 2.8rem; }
#sec03 .sec03-wrap .sec03-item:last-child { margin-right: 0; }
#sec03 .sec03-wrap .sec03-item .img { display: block; text-align: center; }

@media (max-width: 640px) {
  #sec03 .con-title { text-align: center; }
  #sec03 .sec03-wrap { display: block; }
  #sec03 .sec03-wrap .sec03-item { width: 100%; margin-bottom: 4rem; margin-right: 0; }
  #sec03 .sec03-wrap .sec03-item:last-child { margin-bottom: 0; }
}