#info {padding-bottom: 210px; display: flex; align-items: center;}
#info .info_img {flex: 40% 0 0; position: relative;}
#info .info_img .info_photo {position: relative; top: 15px; left : 15px;}
/* #info .info_img .info_photo {transform: translate(30px, 30px); transition: all 0.5s;} */
#info .info_img img {width: 100%; height: 100%;}
#info .info_img .info_bg {width: 100%; height: 100%; position: absolute; bottom: -15px; right: -15px; z-index: -1; max-height: 604px;}
#info .info_txt {flex: 53% 0 0; margin-left: 7%; text-align: center;}
#info .info_txt .title {font-size: 28px;}
#info .info_txt .title span {opacity: 0.5; font-size: 50px; vertical-align: sub;}
#info .info_txt .desc {font-size: 18px; line-height: 2rem; margin-top: 50px;}
#info .info_txt .desc p:not(:last-child) {margin-bottom: 40px;}

table {font-size: 16px; border-top: 1px solid #111; width: 100%;}
table thead {background: #f9f9f9; font-size: 18px; text-align: center;}
table thead tr td {padding: 20px 0;}
table tbody tr td {padding: 15px 0;}
table tbody tr td.purple {vertical-align: baseline; text-align: center; line-height: 2rem;}
#career {padding-bottom: 160px;}
#career table td {border-bottom: 1px solid #ddd;}
#career table tbody td.cont {text-overflow: ellipsis;  white-space: nowrap;  word-wrap: normal;  width: 90%;  overflow: hidden;}
#career table tbody tr td.order {color: #4d4d4d;}

#history {padding-bottom: 210px;}
#history table .border {border-bottom: 1px solid #ddd;}
#history table p {line-height: 2rem;}


@media screen and (max-width: 1024px) {
  #info {padding-bottom: 170px;}
  #info .info_txt .title {font-size: 30px;}
  #info .info_txt .title span {font-size: 40px;}
  #info .info_txt .desc {font-size: 16px; margin-top: 30px;}
  #info .info_txt .desc p:not(:last-child) {margin-bottom: 25px;}
}

@media screen and (max-width: 768px) {
  #info {display: block; padding-bottom: 100px;}
  #info .info_img {width: 80%; margin: 0 auto;}
  #info .info_txt .title {font-size: 26px;}
  #info .info_txt .desc {font-size: 14px; margin-top: 15px; line-height: 1.875rem; text-align: justify;}
  #info .info_txt .desc p:not(:last-child) {margin-bottom: 15px;}
  #info .info_txt {margin-left: 0; margin-top: 60px;}
  #history {padding-bottom: 100px;}
  table {font-size: 14px;}
  table thead {font-size: 16px;}
  table thead tr td {padding: 15px 0;}
  #history table p {line-height: 1.75rem;}
  table tbody tr td {padding: 10px 0;}
}

@media screen and (max-width: 540px) {
  table thead {font-size: 14px;}
  #career table thead {font-size: 12px;}
  #career table {font-size: 10px;}
  #info {padding-bottom: 50px;}
  #history {padding-bottom: 70px;}
  #career.wrapper.sub_wrapper {padding: 50px 10px;}
  #history.wrapper.sub_wrapper {padding: 50px 10px;}
  #career table td { padding: 10px 3px;}
}

@media screen and (max-width: 414px) {
  #info .info_txt .title {font-size: 22px;}
}
