@charset "utf-8";

/*------------------------------
  common
------------------------------*/
/*-- リセット --*/
html { font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','Hiragino Kaku Gothic ProN','游ゴシック', 'Yu Gothic', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', sans-serif; scroll-padding-top: 6.25em; scroll-behavior: smooth; }
body { width: 100%; min-width: 100vw; margin: 0; padding: 0; font-size: 10px; -webkit-text-size-adjust: 100%; color: #444; background-color: #FFF; }
* { margin: 0; padding: 0; text-align: left; line-height: 1.5em; box-sizing: border-box; }
a { text-decoration: none; }
img { width: 100%; border: none; display: block; }
li { list-style: none; }
dl, dt, dd { padding: 0; margin: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
input, select { vertical-align: middle; }
header, main, footer { width: 100%; }
main { font-size: 1.6em; }
h1, h2, h3, h4, h5 { font-size: 1em; }
.cf { zoom:100%; }
.cf:after { content: "."; display: block; visibility: hidden; height: 0.1px; font-size: 0.1em; line-height: 0; clear: both; }
/*-- 共用パーツ --*/
main { overflow-x: hidden !important; }
main.top_wrap::before { content: ''; min-width: 500px; width: 100vw; height: 100vh; background: #00b097 url(/common/img/cover04.png) 50% 0 repeat-y; background-size: 100%; position: fixed; top: 0; left: 0; z-index: -1; }
.bgg { padding: 80px 0 30px 0; color: #FFF; background-color: #00b097; }
.bgw { padding: 80px 0 30px 0; color: #00b097; background-color: #FFF; }
.bgg a { font-weight: 600; color: #FFF; transition: color .5s, background-color .5s, border-color .5s, box-shadow .5s; }
.bgw a { font-weight: 600; color: #00b097; transition: color .5s, background-color .5s, border-color .5s, box-shadow .5s; }
.bgg a:hover { color: #FD6; transition: 0s; }
.bgw a:hover { color: #DA2; transition: 0s; }
.btn, .btn_more { max-width: 440px; width: 80%; margin: 2em auto; position: relative; }
.btn_home { max-width: 550px; width: 80%; margin: 2em auto; position: relative; }
.btn_contact { max-width: 550px; min-width: 260px; width: 80%; margin: 4em auto 5em auto; position: relative; }
.btn a, .btn_more a, .btn_home a { font-size: 1.25em; font-weight: bold; line-height: 3em; text-align: center; color: #00b097; background-color: #FFF; border-color: #00b097; border-style: solid; border-width: 2px; display: block !important; }
.btn a, .btn_more a { letter-spacing: .25em; transition: letter-spacing .6s; }
.btn_contact a { font-size: 1.25em; line-height: 3em; text-align: center; color: #FFF; background-color: #00b097; border: #00b097 solid 2px; display: block !important; transition: .5s; }
.btn a:hover, .btn_more a:hover, .btn_home a:hover { color: #FFF; background-color: #00b097; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); animation: shake .15s linear 3; }
.btn_more a:hover { letter-spacing: .5em; transition: letter-spacing .3s; }
.btn_contact a:hover { color: #00b097; background-color: #FFF; box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }
.bgg .btn a, .bgg .btn_more a, .bgg .btn_home a { color: #FFF; background-color: #00b097; border-color: #FFF; }
 .bgg .btn a:hover, .bgg .btn_more a:hover, .bgg .btn_home a:hover { color: #00b097; background-color: #FFF; }
.bgw .btn a, .bgw .btn_more a, .bgw .btn_home a { color: #00b097; background-color: #FFF; border-color: #00b097; }
.bgw .btn a:hover, .bgw .btn_more a:hover, .bgw .btn_home a:hover { color: #FFF; background-color: #00b097; }
.btn_pagetop { width: 5em; height: 7em; padding-top: 2em; font-weight: bold; line-height: 3em; text-align: center; color: rgba(255,255,255,0); background: url(/common/img/ico/ico_pageup_up.svg) left 50% top .5em no-repeat; background-size: 1em; border-radius: .3em .3em 0 0; box-shadow: 0 0 0 2px #FFF, 0 0 0 3px #00b097, 0 0 0 1px #00b097 inset; display: block; position: fixed; z-index: 110; bottom: -2.5em; left: 1%; transition: .5s; }
.btn_pagetop i { width: 5em; height: 7em; background: url(/common/img/ico/ico_pageup.png) 50% 0 no-repeat; background-size: 100%; display: block; position: absolute; bottom: -1.5em; transition: ease .2s; }
.btn_pagetop:hover { color: rgba(255,255,255,1); text-shadow: 0 1px 0 #00b097, 0 -1px 0 #00b097, 1px 0 0 #00b097, 1px 1px 0 #00b097, 1px -1px 0 #00b097, -1px 0 0 #00b097, -1px 1px 0 #00b097, -1px -1px 0 #00b097; bottom: -.5em; transition: 0s; }
.btn_pagetop:hover i { bottom: 6em; animation: pyon .3s linear 3; }
/*-- サイト内リンクボタン --*/
.bn_link { max-width: 540px; min-width: 300px; width: 80%; margin: 1em auto .5em auto; }
.bn_link a { text-align: center; display: block; }
.bn_link a img { width: 100%; margin-bottom: .25em; }
.bn_link a span { margin: 0 .25em; padding: .3em 1.5em .2em .5em; font-size: .8em; line-height: 1em; color: #FFF; background-color: #00b097; background-image: url(/common/img/ico/ico_next_white.svg); background-position: top 45% right .25em; background-repeat: no-repeat; background-size: 1em; display: inline-block; }
/*-- ボディ内リンクバナー --*/
.bn_link a:hover { animation: pyon .3s ease-out 1; }
.bn_link a:hover img { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); }
.bn_link a:hover span { color: #DA2; background-image: url(/common/img/ico/ico_next_yellow.svg); }
/*-- 一覧表示：該当無しの場合 --*/
.nolist { width: 23em; padding: 10em 0 4em 0; margin: 0 auto; font-size: 1.1em; letter-spacing: .2em; line-height: 3em; text-align: center; text-shadow: 0 1px 0 #FFF, 0 -1px 0 #FFF, 1px 0 0 #FFF, 1px 1px 0 #FFF, 1px -1px 0 #FFF, -1px 0 0 #FFF, -1px 1px 0 #FFF, -1px -1px 0 #FFF; background: rgba(255,255,255,0.6) url(/common/img/bg_history.png) 50% 50% no-repeat; background-size: 160px; background-blend-mode: lighten; }
.nolist span { font-weight: bold; text-align: center; display: block; }
/*-- パンくずリスト --*/
.kaeru_bread { margin: 0; padding-top: 80px; background-color: #FFF; }
.kaeru_bread ul { width: 100vw; display: flex; overflow-x: scroll; }
.kaeru_bread ul::-webkit-scrollbar { display: none; }
.kaeru_bread li { padding-right: 2em; background: url(/common/img/ico/ico_arr_green.svg) right .75em top 45% no-repeat; background-size: .5em; white-space: nowrap; }
.kaeru_bread li span { font-size: .8125em; line-height: 2.5em; color: #00b097; display: block; }
.kaeru_bread li a { display: block; }
.kaeru_bread li a:hover span { color: #DA2; text-decoration: underline; }
.kaeru_bread li:last-child { background: none; }
.kaeru_bread li:last-child span { font-weight: 600; }
.kaeru_bread li.home { margin-left: 2em; }
.kaeru_bread li.home span { padding-left: 4.75em; background: url(/common/img/ico/ico_home2_green.svg) 0 45% no-repeat; background-size: 4.5em; }
/*-- タイトルバー共通 --*/
h2.tit { font-size: 2.8em; font-family: Helvetica, Arial, sans-serif; line-height: 1.2em; text-align: center; }
h2.tit span { font-size: .3em; text-align: center; color: #444; display: block; }
h3.tit_mini { font-size: 1.25em; letter-spacing: .4em; text-align: center; }
.list_title>p { margin-left: 1%; font-size: 3.75em; font-weight: 600; font-family: Helvetica, Arial, sans-serif; line-height: 1em; display: inline-block; }
.list_title .bar { width: 100%; padding: .5em .5% 0 2%; margin-top: -1em; color: #FFF; background-color: #00b097; display: table; z-index: 2; }
.list_title .bar h2, .list_title .bar .listmenu { display: table-cell; }
.list_title .bar h2 { font-size: 1.5em; font-weight: 600; letter-spacing: .25em; }
.list_title .listmenu dl { display: flex; justify-content: flex-end; align-items: center; }
.list_title .listmenu dt { padding-right: 1.5em; font-size: .75em; background: url(/common/img/ico/ico_arr_white.svg) right .5em top 40% no-repeat; background-size: .75em; }
.list_title .listmenu dd a, .list_title .listmenu dd span { padding: .5em 0; margin: 0 .5em 0 0; font-size: .875em; font-weight: bold; line-height: 1em; text-align: center; border-color: #FFF; border-style: solid; border-width: 2px; display: block; }
.list_title .listmenu dd a { margin-bottom: .5em; color: #FFF; background-color: #00b097; border-radius: .35em; }
.list_title .listmenu dd a:hover { color: #00b097; background-color: #FFF; animation: pyon .3s ease-out 1; }
.list_title .listmenu dd span { padding-bottom: 1em; color: #00b097; background-color: #FFF; border-radius: .35em .35em 0 0; }
.list_title.detail .bar { padding: .25em 0; display: flex; align-items: center; }
.list_title.detail .bar h2 { margin: .5em; letter-spacing: 0; line-height: 1.2em; }
.list_title.detail .bar .btn_back a { width: 7.75em; padding: 0 1.5em 0 2.75em; margin-right: 1em; color: #FFF; background-color: #00b097; background-image: url(/common/img/ico/ico_back_white.svg); background-position: left 1em top 45%; background-repeat: no-repeat; background-size: 1.2em; box-shadow: -1px 0 0 1px #FFF inset; border-radius: 0 .5em .5em 0; display: block; white-space: nowrap; position: relative; transition: 0s; }
.list_title.detail .bar .btn_back a:hover { color: #00b097; background-color: #FFF; background-image: url(/common/img/ico/ico_back_green.svg); }
.sub_topic { max-width: 1300px; min-width: 300px; width: 96%; margin: 0 auto 3.75em auto; padding-top: 80px; }
.sub_topic h3 { padding: 1em 2.8em; font-size: 1.5em; font-weight: 600; line-height: 1em; border-top: #00b097 solid 2px; position: relative; }
.sub_topic h3::before { content: ''; width: 1.25em; height: 1.625em; background:  url(/common/img/ico/ico_bookmark_green.svg) 0 0 no-repeat; background-size: 1.25em; position: absolute; top: -.25em; left: .833em; }
/*-- ページャ一覧 --*/
.pager { margin: 3em auto 6em auto; }
.pager ul { display: flex; justify-content: center; }
.pager li { margin-right: .5em; }
.pager li:last-child { margin-right: 0; }
.pager li a, .pager li span { padding: .75em 1em; border: #00b097 solid 2px; border-radius: .3em; background-repeat: no-repeat; background-size: .8em; display: block; transition: 0s; }
.pager li span { color: #FFF; background-color: #00b097; opacity: 0.5; }
.pager li a { background-color: #FFF; }
.pager li.prev a, .pager li.prev span { padding-left: 2em; background-image: url(/common/img/ico/ico_arl_green.svg); background-position: left .5em top 50%; }
.pager li.next a, .pager li.netx span { padding-right: 2em; background-image: url(/common/img/ico/ico_arr_green.svg); background-position: right .5em top 50%; }
.pager li a:hover { color: #FFF; background-color: #00b097; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }
.pager li.prev a:hover { background-image: url(/common/img/ico/ico_arl_white.svg); }
.pager li.next a:hover { background-image: url(/common/img/ico/ico_arr_white.svg); }
/*-- ページャ詳細 --*/
.pager_detail { max-width: 1200px; width: 98%; margin: 6em auto 4em auto; }
.pager_detail ul { display: flex; justify-content: space-between; align-items: center; }
.pager_detail li { margin-right: .25em; }
.pager_detail li:last-child { margin-right: 0; }
.pager_detail li a, .pager_detail li span { padding: .4em; color: #00b097; background-color: #FFF; border: #00b097 solid 2px; border-radius: .5em; display: block; }
.pager_detail li span { opacity: 0.4; }
.pager_detail .prev, .pager_detail .next { max-width: 353px; width: 35%; }
.pager_detail dt { width: 100%; display: flex; align-items: center; }
.pager_detail dt img { width: calc(100% - 6.5em); }
.pager_detail dt p { width: 100%; text-align: center; background-repeat: no-repeat; background-size: .8em; }
.pager_detail dd .title { margin-top: .3em; line-height: 1.2em; }
.pager_detail .prev dt { justify-content: flex-end; }
.pager_detail .prev dt p { padding-left: .5em; background-image: url(/common/img/ico/ico_arl_green.svg); background-position: left .25em top 45%; }
.pager_detail .netx dt { justify-content: flex-start; }
.pager_detail .next dt p { padding-right: .5em; background-image: url(/common/img/ico/ico_arr_green.svg); background-position: right .25em top 45%; }
.pager_detail .back a { padding: 1em 1.5em 1em 2.5em; font-size: 1.25em; line-height: 1em; background-image: url(/common/img/ico/ico_back_green.svg); background-position: left .75em top 45%; background-repeat: no-repeat; background-size: 1.2em; transition: 0s; }
.pager_detail li a:hover { color: #FFF; background-color: #00b097; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); animation: shake .15s linear 2; }
.pager_detail .prev a:hover dt p { background-image: url(/common/img/ico/ico_arl_white.svg); }
.pager_detail .next a:hover dt p { background-image: url(/common/img/ico/ico_arr_white.svg); }
.pager_detail .back a:hover { background-image: url(/common/img/ico/ico_back_white.svg); }

/*-- 問合せ導線inline --*/
.contact_inline { padding-bottom: 1.5em; color: #444; background-color: #FFF; border-width: 1px 0; border-color: #00b097; border-style: solid; }
.contact_inline>span { max-width: 960px; min-width: 300px; width: 100%; margin: 0 auto; display: block; }
.contact_inline h3.tit { width: 7em; margin: 0 auto; padding: .5em 0; font-size: 2.8em; font-weight: 600; font-family: Helvetica, Arial, sans-serif; line-height: 1.2em; text-align: center; color: #00b097; position: relative; z-index: 1; }
.contact_inline h3.tit span { font-size: .3em; letter-spacing: .8em; text-align: center; color: #444; display: block; }
.contact_inline h3.tit::before { content: ''; width: 200px; height: 97px; background-image: url(/common/img/bg_contact_inline01.png); background-position: 0 0; background-repeat: no-repeat; background-size: 100%; position: absolute; top: 0; right: -3.5em; z-index: -1; }
.contact_inline p { margin: .5em auto; font-size: 1.5em; font-weight: 600; letter-spacing: .25em; text-align: center; }
.btn_contact_inline a { max-width: 900px; min-width: 300px; width: 100%; margin: 0 auto; text-align: center; color: #FD6; background-color: #06C; border-color: #06C; border-width: 4px; border-style: solid; display: block; }
.btn_contact_inline a span { padding: 1em 1em 1em 3em; background-image: url(/common/img/ico/ico_mail_airplane_lightyellow.svg); background-position: 0 50%; background-repeat: no-repeat; background-size: 2.5em; display: inline-block;  }
.btn_contact_inline a:hover { color: #00b097; background-color: #FFF; border-color: #00b097; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); animation: shake .15s ease-out 2; }
.btn_contact_inline a:hover span { background-image: url(/common/img/ico/ico_mail_airplane_green.svg); }
.contact_inline ul { max-width: 700px; min-width: 300px; width: 75%; margin: 1em auto; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; }
.contact_inline li { width: 49%; margin: 0 .5%; }
.contact_inline li a { width: 100%; font-size: 1.15em; font-weight: 600; line-height: 2.8em; text-align: center; color: #FFF; background-color: #00b097; border: #00b097 solid 2px;  border-radius: .3em; display: block; }
.contact_inline li a span { padding-left: 2.25em; background-image: url(/common/img/ico/ico_kaeru_w.svg); background-position: 0 50%; background-repeat: no-repeat; background-size: 2em; display: inline-block; }
.contact_inline li a:hover { color: #00b097; background-color: #FFF; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out; }
.contact_inline li a:hover span { background-image: url(/common/img/ico/ico_kaeru_green.svg); }
/*-- TOPページの場合はイラストを表示 --*/
.top_wrap .contact_inline { padding: 6em 0; }
.top_wrap .contact_inline h3.tit { min-width: 300px; max-width: 600px; width: 90%; padding: 0 0 7em 0; margin: 0 auto; background-image: url(/common/img/bg_contact_inline02.png); background-position: 50% 100%; background-repeat: no-repeat; background-size: 100%; }
.top_wrap .contact_inline h3.tit::before { display: none; }


/*-- ダウンロードファイル --*/
.dl_files>div>p, .dl_files .files { max-width: 980px; min-width: 300px; margin: 1.5em auto; line-height: 2em; color: #444; }
.dl_files .mail a { padding-left: 2.5em; font-size: 1.25em; letter-spacing: .15em; line-height: 2em; background-image: url(/common/img/ico/ico_mail_airplane_green.svg); background-position: 0 50% ; background-repeat:no-repeat; background-size: 2.2em; display: inline-block; }
.dl_files .mail a:hover { background-image: url(/common/img/ico/ico_mail_airplane_yellow.svg); animation: pyon .3s ease-out 1; }
.dl_files .files li { padding: .5em; margin: 0 auto .5em auto; border: #AAA solid 1px; }
.dl_files .files dl { width: 100%; display: flex; justify-content: space-between; }
.dl_files .files dt { padding-left: 5em; background-position: 0 50%; background-repeat: no-repeat; background-size: 4em; }
.dl_files .files .image dt { background-image: url(/common/img/ico/ico_image.svg); }
.dl_files .files .pdf dt { background-image: url(/common/img/ico/ico_pdf.svg); }
.dl_files .files .doc dt { background-image: url(/common/img/ico/ico_doc.svg); }
.dl_files .files .xlsx dt { background-image: url(/common/img/ico/ico_xlsx.svg); }
.dl_files .files .xls dt { background-image: url(/common/img/ico/ico_xlsx.svg); }
.dl_files .files .audio dt { background-image: url(/common/img/ico/ico_audio.svg); }
.dl_files .files .video dt { background-image: url(/common/img/ico/ico_video.svg); }
.dl_files .files .zip dt { background-image: url(/common/img/ico/ico_zip.svg); }
.dl_files .files h4 { padding-top: .25em; font-size: 1.5em; font-weight: 600; line-height: 1.5em; }
.dl_files .files .limit, .dl_files .files .size { color: #00b097; }
.dl_files .files .size { padding-left: 1.5em; letter-spacing: .1em; background: url(/common/img/ico/ico_hdd_green.svg) 0 50% no-repeat; background-size: 1.2em; }
.dl_files .comment { margin: .5em 0 0 0; padding: 1em 1.5em .5em 1.5em; color: #666; border: #CCC solid 1px; border-radius: .25em; }
.dl_files .files .dl, .dl_files .files .dl_out { width: 10em; height: 100%; font-size: 1.25em; line-height: 3em; text-align: center; color: #FFF; border-radius: .25em; display: block; }
.dl_files .files .dl { background-color: #00b097; }
.dl_files .files .dl_out { background-color: #CCC; }
.dl_files .files .dl span, .dl_files .files .dl_out span { padding-left: 2em; background-image: url(/common/img/ico/ico_download_white.svg); background-position: 0 50%; background-repeat: no-repeat; background-size: 1.6em; }
.dl_files .files .dl:hover { color: #FD6; background-image: url(); box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }
.dl_files .files .dl:hover span { background-image: url(/common/img/ico/ico_download_yellow.svg); }
.dl_files .info { width: 31.5em; padding-left: 1.5em; margin: 0 auto; background: url(/common/img/ico/ico_info_green.svg) 0 50% no-repeat; background-size: 1.2em; }
.dl_files .info.long { width: 39.5em; }
.dl_files .files .exp_out { border-color: #CCC; }
.dl_files .files .exp_out dt { opacity: 0.5; }
.dl_files .files .exp_out h4, .dl_files .files .exp_out .limit { color: #444; }


/*-- アニメーション定義 --*/
@keyframes shake {
  0% {transform: skew(0deg,0deg);}
  25% {transform: skew(1.5deg, 1.5deg);}
  75% {transform: skew(-1deg, -1deg);}
  100% {transform: skew(0deg,0deg);}
}
@keyframes pyon {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  10%  { transform: scale(1.05, 0.95) translate(0%, 3%); }
  40%  { transform: scale(1.1, 0.9) translate(0%, 8%); }
  50%  { transform: scale(1.0, 1.0) translate(0%, 0%); }
  60%  { transform: scale(0.95, 1.1) translate(0%, -25%); }
  75%  { transform: scale(0.95, 1.1) translate(0%, -10%); }
  85%  { transform: scale(1.1, 0.9) translate(0%, 8%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}


/*------------------------------
  header
------------------------------*/
header { width: 100vw; height: 80px; font-size: 1.8em; color: #FFF; background-color: rgba(0,176,151,0.9); position: fixed; top: 0; z-index: 100; }
header a { color: #FFF; display: block; }
header h1 { padding-left: 10em; font-size: .722em; font-weight: normal; line-height: 2em; background: url(/common/img/ico/ico_bookmark_white.svg) left 8em top 0 no-repeat; background-size: 1.5em; }
.header_wrap { width: 98%; height: 80px; margin-top: -1.44em; display: flex; justify-content: space-between; }
.headlogo { width: 300px; margin-left: 1em; padding-top: .6em; }
.headlogo a:hover img { animation: pyon .3s ease-out 1; }
/*-- ヘッダメニュー --*/
header .headmenu { width: calc(100% - 380px); max-width: 1032px; height: 100%; margin-left: 5%; }
header .headmenu input[type="checkbox"], header .headmenu label { display: none; }
header .headmenu ul { width: 100%; height: 100%; display: flex; justify-content: flex-start; align-items: stretch; }
header .headmenu>ul>li { width: 16.666%; flex-grow: 1; position: relative; }
@keyframes headmenu {
  100%{ transform: translate3d(0, -.5em, 0); }
}
.headmenu a { width: 100%; height: 100%; font-weight: 600; line-height: 90px; text-align: center; white-space: nowrap; overflow: hidden; }
.headmenu a span { display: inline-block; }
.headmenu a:hover { color: #00b097; background-color: #FFF; }
.headmenu a:hover span { animation-name: headmenu; animation-duration: .05s; animation-direction: alternate; animation-iteration-count: 2; }
.headmenu a:hover span:nth-child(2) { animation-delay: .025s; }
.headmenu a:hover span:nth-child(3) { animation-delay: .05s; }
.headmenu a:hover span:nth-child(4) { animation-delay: .075s; }
.headmenu a:hover span:nth-child(5) { animation-delay: .1s; }
/*-- サブメニュー --*/
.headmenu .submenu { height: 0; display: block; transition: height .1s; }
.headmenu .submenu li { width: 16em; font-size: .8em; color: #FFF; background-color: rgba(0,176,151,0.9); }
.headmenu .submenu.wide { max-width: 960px; width: calc(100vw - 380px); display: flex; flex-wrap: wrap; }
.headmenu .submenu.wide li { width: 33%; }
.headmenu .submenu li a { padding: 0 8% 0 15%; height: 0; line-height: 0; text-align: left; color: rgba(255,255,255,0); pointer-events: none; transition: line-height .3s, color 0s; }
.headmenu .submenu li a .frame { padding: 0 .5em; margin-right: .5em; font-size: .8em; line-height: 1em; border-color: rgba(255,255,255,0); border-width: 1px; border-style: solid; animation: none; }
.headmenu .submenu li a .frame.out { padding: 0 1.5em 0 .5em; background-image: url(../img/ico/ico_out_white.svg); background-position: top 30% right .25em; background-repeat: no-repeat; background-size: 1em; }
.headmenu li:hover .submenu { height: 60px; transition: height .5s 1s; }
.headmenu li:hover .submenu li a { height: 60px; line-height: 60px; color: rgba(255,255,255,1); box-shadow: 0 0 0 1px #FFF; pointer-events: visible; transition: height .3s, line-height .5s, color .3s, background-color .3s; }
.headmenu li:hover .submenu li a .frame { padding: .25em .5em; border-color: rgba(255,255,255,1); }
.headmenu li:hover .submenu li a .frame.out { padding: .25em 1.5em .25em .5em; }
.headmenu li:hover .submenu li a:hover { margin-top: 0; color: #00b097; box-shadow: 0 0 0 1px rgba(0,176,151,0.9); transition: color .3s, background-color .3s, box-shadow 0s; }
.headmenu li:hover .submenu li a:hover .frame { border-color: #00b097; }
.headmenu li:hover .submenu li a:hover .frame.out { background-image: url(../img/ico/ico_out_green.svg); }

.headmenu li:hover .submenu li.clinic { background-color: rgba(64,168,182,0.9); }
.headmenu li:hover .submenu li.clinic a:hover { color: #06C; }
.headmenu li:hover .submenu li.clinic a:hover .frame { border-color: #06C; background-image: url(../img/ico/ico_out_blue.svg); }



/*-- お問合せボタン：右フロート --*/
header .tab_contact a { width: 260px; height: 240px; font-weight: 600; letter-spacing: .1em; color: #06C; background: linear-gradient(to Top, #DB2, #FD6); border-radius: .8em 0 0 .8em; box-shadow: 0 2px 6px 1px rgba(0,0,0,0.3); position: fixed; top: calc(50% - 130px); right: -200px; transition: all .5s; }
header .tab_contact a:hover { color: #00b097; background: #FFF; box-shadow: 0 0 0 2px #00b097 inset, 0 2px 6px 1px rgba(0,0,0,0.8); right: 0; transition: right .25s; }
header .tab_contact .tab { width: 60px; height: 100%; padding: 68px 18px 0 26px; background-image: url(/common/img/ico/ico_mail_airplane_blue.svg); background-position: top 25px left 50%; background-repeat: no-repeat; background-size: 38px; display: inline-block; writing-mode: vertical-rl; filter: drop-shadow(0 1px 1px rgba(255,230,128,1)); }
header .tab_contact .body { width: 200px; height: 100%; background: url(/common/img/bg_contact02.png) 50% 50% no-repeat; background-size: 200px; display: inline-block; opacity: 0; }
header .tab_contact a:hover .tab { background-image: url(/common/img/ico/ico_mail_airplane_green.svg); filter: none; }

header .tab_contact a:hover .body { opacity: 1; }


/*------------------------------
  footer
------------------------------*/
footer { width: 100vw; padding: 6.68vw 0 0 0; background: #FFF url(/common/img/hr_footer_green.svg) 50% 0 no-repeat; background-size: 101%; position: relative; }
footer .footer_body { color: #FFF; background-color: #00b097; }
.footer_info { width: 100%; padding: 1em 0; font-size: 1.6em; display: table; }
.footer_info dt { min-width: 300px; max-width: 570px; width: 30vw; display: table-cell; vertical-align: top; }
.footer_info dt a { width: 100%; height: 100%; padding: 1.5vw 4.16vw 1.5vw 12.5vw; color: #00b097; background-color: #FFF; display: block; }
.footer_info dt a img { max-width: 250px; min-width: 200px; display: block; }
.footer_info dt a:hover img { animation: pyon .3s ease-out 1; }
.footer_info dd { padding-left: 2em; display: table-cell; vertical-align: top; }
.footer_info h4 { font-size: 1.5em; font-weight: 600; line-height: 2em; }
.footer_info h4 span { margin-left: .25em; }
.footer_info .office { width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; }
.footer_info .office li { min-width: 32em; max-width: 40em; width: 50%; margin-bottom: .2em; font-size: .88em; }
.footer_info .office li .name { width: 10em; margin-right: .5em; font-size: .8em; font-weight: 600; letter-spacing: .1em; text-align: center; border: #FFF solid 1px; display: inline-block; }
.footer_info .office li .name.short { letter-spacing: .5em; }
.footer_info .office li .name.long { letter-spacing: 0; }
/*-- フッターメニュー --*/
.footmenu { width: 84%; margin: 2em 6% 2em 10%; display: flex; flex-wrap: wrap; }
.footmenu li a { width: 8em; font-size: 1.8em; line-height: 4em; text-align: center; color: #FFF; background-color: #00b097; display: block; }
.footmenu li a:hover { color: #00b097; background-color: #FFF; animation: shake .15s linear 3; }
/*-- © --*/
.copyright { padding-bottom: 2.5em; font-size: 1.3em; line-height: 1.5em; letter-spacing: .2em; text-align: center; }
.copyright a { color: #FFF; }
.copyright a:hover { text-decoration: underline; }
.copyright .sp_only { display: none; }


/*------------------------------
  TOPページ
------------------------------*/
/*-- cover --*/
#top_cover { width: 100vw; height: 62vw; padding: 34vw 0 7vw 0; overflow: hidden; position: relative; }
#top_cover::after { content: ""; width: 100vw; height: 6.77vw; background-image: url(/common/img/hr_footer_white.svg); background-position: 50% 100.3%; background-repeat: no-repeat; background-size: 101%; filter: drop-shadow(-1px 0 3px rgba(28,102,86,0.2)); display: block; position: absolute; bottom: 0; z-index: 20; }

#top_cover i.hero { width: 100%; margin: 0 auto; display: block; position: absolute; top: 80px; }
#top_cover .newsticker { width: 50%; margin: 0 6% 0 0; background-color: rgba(0,176,151,0.6); border-radius: .5em; display: block; position: absolute; z-index: 10; }
#top_cover .newsticker dl { display: flex; }
#top_cover .newsticker dt { padding: 0 1em 0 0; margin-right: .5em; font-size: .8em; line-height: 1.875em; font-weight: normal !important; border-right: #FFF solid 1px; }
#top_cover .newsticker dt span { padding: .25em .75em .25em 1em; margin-right: 1em; height: 100%; font-weight: 600; color: #00b097; background-color: #FFF; position: relative; }
#top_cover .newsticker dt span::after { content: ''; width: 0; height: 0; border-color: transparent transparent transparent #FFF; border-style: solid; border-width: 1em 0 1em .6em; position: absolute; top: 0; right: -.5em; }
#top_cover .newsticker dd { width: calc(100% - 13em); line-height: 1.5em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
/*-- カバースライダー --*/
.cover_slider { width: 100vw; margin-top: 2em; }
.cover_slider li { margin: 10px .5em; transition: .5s; }
.cover_slider li a { width: 100%; height: 100%; padding: 2px 2px 10px 2px; background: #00b097; display: block; filter:drop-shadow(2px 3px 5px rgba(28,102,86,0.5)); }
.cover_slider li dl { position: relative; }
.cover_slider li dt { width: 100%; overflow: hidden; }
.cover_slider li dt img { width: 100%; transition: .5s; }
.cover_slider li dd { padding: .25em .5em .25em .8em; }
.cover_slider li dd .label { font-size: .888em; }
.cover_slider li dd .genre { padding: .25em .5em .25em 1.75em; font-size: .8em; line-height: 1em; background-size: 1.2em; background-position: left .3em bottom .175em; background-repeat: no-repeat; border: #FFF solid 1px; border-radius: .3em; display: inline-block; }
.cover_slider li dd .genre.office { background-image: url(/common/img/ico/ico_office_white.svg); }
.cover_slider li dd .genre.shop { background-image: url(/common/img/ico/ico_shop_white.svg); }
.cover_slider li a dd .genre.logo { background-image: url(/common/img/ico/ico_kaeru_white.svg); }
.cover_slider li a dd .genre.dtp { background-image: url(/common/img/ico/ico_book_white.svg); }
.cover_slider li a dd .genre.web { background-image: url(/common/img/ico/ico_mac_white.svg); }
.cover_slider li a:hover dd .genre { border-color: #FD6; }
.cover_slider li a:hover dd .genre.office { background-image: url(/common/img/ico/ico_office_yellow.svg); }
.cover_slider li a:hover dd .genre.shop { background-image: url(/common/img/ico/ico_shop_yellow.svg); }
.cover_slider li a:hover dd .genre.logo { background-image: url(/common/img/ico/ico_kaeru_yellow.svg); }
.cover_slider li a:hover dd .genre.dtp { background-image: url(/common/img/ico/ico_book_yellow.svg); }
.cover_slider li a:hover dd .genre.web { background-image: url(/common/img/ico/ico_mac_yellow.svg); }
.cover_slider li a:hover { background: #4CA; box-shadow: 0 0 0 3px #4CA; transition: 0s; animation: pyon .3s ease-out 1; }
.cover_slider li a:hover img { filter: brightness(0.5); transition: 0s; }
.cover_slider li a:hover .info { opacity: 1; }
.cover_slider li dd .title { padding: .25em 0; height: 2.5em; font-size: 1.1em; line-height: 1.25em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }

/*-- cover2 --*/
#top_cover2 { content: ''; height: 20vw; }

/*-- about --*/
#top_about { padding-top: 8em; padding-bottom: 6em; }
#top_about .about_body { max-width: 860px; min-width: 300px; width: 80%; margin: 1.5em auto 2em auto; padding-top: 480px; font-size: .888em; letter-spacing: .35em; color: #444; background-image: url(/common/img/img_kdp.jpg); background-position: 50% 0; background-repeat: no-repeat; background-size: 100%; }
.box_division { max-width: 1500px; min-width: 300px; width: 90%; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; }
.box_division p { width: 32.26%; margin: 0 .8%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.box_division p:nth-child(1) { margin-left: 0; }
.box_division p:nth-child(3) { margin-right: 0; }
.box_division a { max-height: 200px; min-height: 90px; height: 10.41vw; margin-bottom: 1em; text-align: center; text-shadow: 0 2px 0 #FFF, 0 -2px 0 #FFF, 2px 0 0 #FFF, 2px 2px 0 #FFF, 2px -2px 0 #FFF, -2px 0 0 #FFF, -2px 2px 0 #FFF, -2px -2px 0 #FFF; background-position: 0 0; background-repeat: no-repeat; background-size: 100%; border: #00b097 solid 2px; border-radius: .5em; display: block; position: relative; transition: .3s; }
.box_division a span { height: 3em; margin: auto; line-height: 1.5em; text-align: center; display: block; position: absolute; top :0; right: 0; bottom: 0; left: 0; }
.box_division a:hover { text-shadow: 0 2px 0 #00b097, 0 -2px 0 #00b097, 2px 0 0 #00b097, 2px 2px 0 #00b097, 2px -2px 0 #00b097, -2px 0 0 #00b097, -2px 2px 0 #00b097, -2px -2px 0 #00b097; color: #FFF; background-color: #00b097; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); transition: 0s; animation: shake .15s linear 3; }
.box_division .architecture a { background-image: url(/common/img/btn_bg_architecture.png); }
.box_division .facility a { background-image: url(/common/img/btn_bg_facility.png); }
.box_division .estate a { background-image: url(/common/img/btn_bg_estate.png); }
.box_division .creative a { background-image: url(/common/img/btn_bg_creative.png); }
.box_division .planning a { background-image: url(/common/img/btn_bg_planning.png); }
.box_division .estate a span, .box_division .planning a span { line-height: 3em; }

/*-- news --*/
#top_news {padding: 8em 0 6em 0; background-image: url(/common/img/bg_infomation02.png), url(/common/img/bg_ruler_white.png); background-position: right 0 bottom -1em, left 0 top 0; background-repeat: no-repeat, repeat-y; background-size: 290px, 20px; }
/*-- お知らせタイトルのイラスト使用停止
#top_news h2 { margin-top: -1.3em; padding-top: 1.3em; background-image: url(/common/img/bg_infomation01.png); background-position: 50% 50%; background-repeat: no-repeat ; background-size: 600px; }
--*/
.top_news_list { max-width: 800px; min-width: 300px; width: 90%; margin: 2em auto; display: flex; flex-wrap: wrap; }
.top_news_list li { width: 100%; margin-bottom: 1.5em; }
.top_news_list li:nth-child(odd) { margin-right: 4%; }
.top_news_list a dl { display: flex; align-items: center; }
.top_news_list a dt { max-width: 160px; width: 20%; max-height: 90px; height: auto; overflow: hidden; transition: .5s; }
.top_news_list a dt img { width: 100%; transition: .5s; }
.top_news_list a dd { width: 69%; margin-left: 1.6%; }
.top_news_list a .update { font-size: .9em; font-weight: normal; line-height: 2em; }
.top_news_list a .category { padding: 0 .5em; margin-right: .5em; font-weight: bold; border: #FFF solid 1px; }
.top_news_list a .title { font-size: 1.25em; line-height: 1.2em; transition: .5s; }
.top_news_list a:hover dt { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); transition: 0s; }
.top_news_list a:hover dt img { opacity: 0.8; transform: scale(1.1); transition: 0s; }
.top_news_list a:hover .category { border-color: #FD6; }
.top_news_list a:hover .title { color: #FD6; transition: 0s; }

/*-- service --*/
#top_service { padding: 8em 0 6em 0; background-image: url(/common/img/bg_service03.png); background-position: left 0 bottom 0; background-repeat: no-repeat; background-size: 570px; position: relative; }
.top_service_list { max-width: 1500px; min-width: 300px; width: 80%; margin: 4em auto 2em auto; display: flex; flex-wrap: wrap; }
.top_service_list li { width: 32%; margin: 0 2% 1.5em 0; }
.top_service_list li:nth-child(3n+3) { margin-right: 0; }
.top_service_list a { border: #00b097 solid 2px; display: block; position: relative; }
.top_service_list a .on { position: absolute; top: 0; left: 0; opacity: 0; transition: .5s; }
.top_service_list a:hover { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); animation: shake .15s ease-out 2; }
.top_service_list a:hover .on { opacity: 1; transition: .25s; }
#top_service .btn_more { margin: 80px auto; z-index: 10; }
#top_service .btn_more::before { content: ''; width: 600px; height: 250px; background: url(/common/img/bg_service02.png) 0 0 no-repeat; background-size: 100%; position: absolute; top: -80px; left: -80px; z-index: -1; }
/*-- KCDリンク --*/
.service_link_kcd { max-width: 270px; min-width: 160px; width: 19vw; max-height: 270px; min-height: 160px; height: 19vw; background: url(/common/img/bn/bg_kcd_rightbottom.jpg) 100% 100% / 100% no-repeat; display: flex; justify-content: center; align-items: flex-end; position: absolute; right: 0; bottom: 0; }
.service_link_kcd a { width: 11em; padding: .75em 1.5em .5em 1.5em; color: #FFF; background-color: #00b097; background-image: url(/common/img/ico/ico_out_white.svg); background-position: bottom 1em right 1.75em; background-repeat: no-repeat; background-size: .9em; border-radius: .5em .5em 0 0; transition: padding .5s ease-in-out, background-position .5s ease-in-out, filter .5s ease-in-out; }
.service_link_kcd a span { padding: 0; letter-spacing: .05em; }
.service_link_kcd a:hover { padding-bottom: 1em; background-image: url(/common/img/ico/ico_out_yellow.svg); background-position: bottom 1.5em right 1.75em; filter: drop-shadow(-1px -2px 1px rgba(0,0,0,0.2)); }

/*-- works --*/
#top_works { padding-top: 8em; padding-bottom: 4em; }
#top_works h2 { padding-top: 60px; margin-top: -20px; background: url(/common/img/bg_works01.png) 50% 0 no-repeat; background-size: 190px; }
#top_works .btn_more { margin-bottom: 80px; z-index: 10; }
#top_works .btn_more::before { content: ''; width: 78px; height: 130px; background: url(/common/img/bg_works02.png) 0 0 no-repeat; background-size: 100%; position: absolute; top: 3em; right: 0; z-index: -1; }
.top_works_list { max-width: 1500px; min-width: 300px; width: 90%; margin: 2em auto; }
.top_works_list li a dd p, .top_works_list li a dd span { display: inline-block; }
.top_works_list li a dd p { width: calc(100% - 6em); color: #444; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition: .5s; }
.top_works_list .large { width: 66%; margin-right: 2%; float: left; }
.top_works_list .medium { width: 32%; margin-bottom: 1em; float: right; }
.top_works_list a dt { width: 100%; overflow: hidden; transition: .5s; }
.top_works_list a dt img { transition: .5s; }
.top_works_list a dd { margin-top: .15em; font-size: 1.25em; font-weight: normal; line-height: 1.2em; display: flex; }
.top_works_list dd .genre { width: 7em; margin-right: .5em; font-size: .75em; font-weight: 600; line-height: 1.8em; text-align: center; color: #00b097; border: #00b097 solid 1px; }
.top_works_list .large dd p { width: calc(100% - 6em); font-weight: 600; color: #00b097; }
.top_works_list .large dd .genre { line-height: 3.5em; white-space: nowrap; }
.top_works_list .large dd .company { font-size: .9em; font-weight: normal; color: #444; display: block; }
.top_works_list li a:hover dt { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); transition: 0s; animation: shake .15s ease-out 2; }
.top_works_list li a:hover dt img { filter: brightness(0.6); transition: 0s; }
.top_works_list li a:hover dd p { color: #00b097; transition: 0s; }
.top_works_list li a:hover dd .company { color: #00b097; }

/*-- flow --*/
#flow { padding: 8em 0 6em 0; }
#flow img { max-width: 1280px; min-width: 320px; width: 96%; margin: 0 auto; }
#flow .read { max-width: 1080px; min-width: 300px; width: 92%; margin: 2em auto; font-size: 1.25em; }
#flow .read span { margin: .5em auto; text-align: center; display: block; }

/*-- faq --*/
#faq { padding: 6em 0; }
#faq .read { margin: 2em auto; letter-spacing: .15em; text-align: center; color: #444; }
.faq_list { max-width: 980px; min-width: 300px; width: 90%; margin: 0 auto; }
.faq_list li { margin: 0 auto 2em auto; }
.faq_list .fold { position: relative; }
.faq_list .fold input[type="checkbox"] { display: none; }
.faq_list .fold label { width: 100%; padding: .75em 2em .75em 4em; font-size: 1.25em; font-weight: 600; line-height: 1.5em; color: #00b097; background-color: #FFF; background-image: url(/common/img/ico/ico_kaeru_green.svg); background-position: left 1.25em top 42%; background-size: 2.5em; background-repeat: no-repeat; border: #00b097 solid 2px; box-shadow:  0 -2px 3px 2px #AED inset, 0 3px 2px 0 rgba(0,0,0,0.15); border-radius: .5em; display: block; position: absolute; top: 0; }
.faq_list .fold .answer { padding: 5em 2em 3em 2.5em; margin-top: -1em; line-height: 1.75em; color: #FFF; background-color: #00b097; box-shadow: 0 0 5px 0 rgba(0,0,0,0.15) inset; border-radius: .625em; }

/*------------------------------
  お知らせ一覧
------------------------------*/
.info_wrap { max-width: 1500px; min-width: 300px; width: 100%; padding-top: 0 !important; margin: 0 auto; }
/*-- タイトル --*/
.list_title.info>p { padding: 1em 700px 0 0; background: url(/common/img/bg_infomation_title01.png) right 0 bottom .265em no-repeat; background-size: 700px; }
.list_title.info .listmenu dd a, .list_title.info .listmenu dd span { width: 9em; }
/*-- リスト：共通 --*/
.newslist li a { display: block; }
.newslist li .update { font-size: .875em; font-weight: normal; letter-spacing: .15em; }
.newslist li .category { padding: 0 .5em; margin-right: .5em; font-size: .875em; font-weight: 600; border-color: #00b097; border-style: solid; border-width: 1px; transition: .5s; }
.newslist li .title { font-size: 1.25em; line-height: 1.2em; }
/*-- リスト：大 --*/
.newslist.large { margin: 3em auto 1em auto; display: flex; flex-wrap: wrap; }
.newslist.large li { max-width: 490px; width: 31.33%; margin: 0 1% 1.5em 1%; }
.newslist.large li a dt { width: 100%; overflow: hidden; transition: .3s; }
.newslist.large li a dt img { width: 100%; transition: .5s; }
.newslist.large li a dd p { margin-top: .3em; }
.newslist.large li a:hover dt { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); transition: 0s; animation: shake .15s ease-out 2; }
.newslist.large li a:hover dt img { filter: brightness(0.6); transition: 0s; }
.newslist.large li a:hover { color: #DA2; transition: 0s; }
.newslist.large li a:hover .category { border-color: #DA2; transition: 0s; }
/*-- リスト：小 --*/
.newslist.small { margin: 0 auto 2em auto; }
.newslist.small li { padding-bottom: 1em; margin-bottom: 1.25em; border-bottom: #00b097 solid 1px; }
.newslist.small li a { max-width: 1200px; width: 80%; margin: 0 auto; display: block; }
.newslist.small li dl { display: flex; }
.newslist.small li dt { margin-right: 1em; }
.newslist.small li a:hover { color: #DA2; transition: 0s; }
.newslist.small li a:hover .category { border-color: #DA2; transition: 0s; }

/*------------------------------
  お知らせ詳細
------------------------------*/
/*-- タイトル --*/
.list_title.detail.info .bar h2 { font-size: 2.625em; }
.list_title.detail.info .bar .btn_back a { height: 3.5em; line-height: 3.5em; }
.info_detail { width: 96%; margin: 1em auto; }
.info_detail .update { padding-right: 1em; font-size: .875em; letter-spacing: .2em; line-height: 1em; text-align: right; }
.info_detail .coverimg { width: 100%; margin: 1em auto; }
/*-- 本文 --*/
.info_body { max-width: 1080px; width: 90%; margin: 2em auto; font-size: 1.125em; color: #444; }
.info_body　h3, .info_body h4 { margin: 2em auto .25em auto; font-size: 1.25em; font-weight: 600; line-height: 1.2em; text-align: center; color: #00b097; }
.info_body p { margin: 1em auto 2em auto; line-height: 2.66em; }
.info_body a, .info_body span { margin: 0 .25em; display: inline-block; }
.info_body a:hover { animation: pyon .15s ease-out 1; }
.info_body figure { max-width: 720px; min-width: 260px; width: 66.66%; margin: 0 auto 1em auto; }
.info_body figure img { width: 100%; }
.info_body dl { padding: .25em 2%; border-top: #888 solid 1px; border-bottom: #888 solid 1px; }
.info_body dt { margin: .75em 0 1.25em 0; font-size: 1.25em; font-weight: bold; line-height: 1em; color: #00b097; }
.info_body dd { margin: .75em 0; line-height: 1em; }


/*------------------------------
  制作事例一覧
------------------------------*/
.works_wrap { max-width: 1500px; min-width: 300px; width: 100%; padding-top: 0 !important; margin: 0 auto; }
/*-- タイトル --*/
.list_title.works>p { padding: 1em 300px 0 0; background-position: right 0 bottom .265em; background-repeat: no-repeat; background-size: 300px; }
.list_title.works>p.all { background-image: url(/common/img/bg_works_title00.png); }
.list_title.works>p.interior { background-image: url(/common/img/bg_works_title01.png); }
.list_title.works>p.electric { background-image: url(/common/img/bg_works_title02.png); }
.list_title.works>p.creative { background-image: url(/common/img/bg_works_title03.png); }
.list_title.works .listmenu dd a, .list_title.works .listmenu dd span { width: 12em; }
/*-- サブメニュー --*/
.submenu.works { margin: 1em 3%; display: flex; flex-wrap: wrap; }
.submenu.works li { margin: 0 .5em .5em 0; }
.submenu.works a, .submenu.works span { width: 13em; padding: .5em 0; font-weight: 600; line-height: 1.5em; text-align: center; background-repeat: no-repeat; border: #00b097 solid 2px; border-radius: .5em; display: block; }
.submenu.works .shop a, .submenu.works .shop span { padding-left: 1em; background-size: 1.25em; background-position: 20% 45%; }
.submenu.works .shop a { transition: .3s; }
.submenu.works a:hover { border-color: #DA2; animation: pyon ease-out .25s; transition: .15s; }
.submenu.works .shop a { background-image: url(/common/img/ico/ico_shop_green.svg); }
.submenu.works .shop a:hover { background-image: url(/common/img/ico/ico_shop_orange.svg); }
.submenu.works .shop span { background-image: url(/common/img/ico/ico_shop_white.svg); }
.submenu.works .office a, .submenu.works .office span { padding-left: 1em; background-size: 1.25em; background-position: 12% 45%; }
.submenu.works .office a { background-image: url(/common/img/ico/ico_office_green.svg); }
.submenu.works .office a:hover { background-image: url(/common/img/ico/ico_office_orange.svg); }
.submenu.works .office span { background-image: url(/common/img/ico/ico_office_white.svg); }
.submenu.works .logo a, .submenu.works .logo span { padding-left: 1.5em; background-size: 1.75em; background-position: 18% 45%; }
.submenu.works .logo a { background-image: url(/common/img/ico/ico_kaeru_green.svg); }
.submenu.works .logo a:hover { background-image: url(/common/img/ico/ico_kaeru_orange.svg); }
.submenu.works .logo span { background-image: url(/common/img/ico/ico_kaeru_w.svg); }
.submenu.works .dtp a, .submenu.works .dtp span { padding-left: 1.5em; background-size: 1.5em; background-position: 8% 50%; }
.submenu.works .dtp a { background-image: url(/common/img/ico/ico_book_green.svg); }
.submenu.works .dtp a:hover { background-image: url(/common/img/ico/ico_book_orange.svg); }
.submenu.works .dtp span { background-image: url(/common/img/ico/ico_book_white.svg); }
.submenu.works .web a, .submenu.works .web span { padding-left: 1.5em; background-size: 1.5em; background-position: 19% 50%; }
.submenu.works .web a { background-image: url(/common/img/ico/ico_mac_green.svg); }
.submenu.works .web a:hover { background-image: url(/common/img/ico/ico_mac_orange.svg); }
.submenu.works .web span { background-image: url(/common/img/ico/ico_mac_white.svg); }
.submenu.works span { color: #FFF; background-color: #00b097; }
/*-- リスト：共通 --*/
.workslist li a { font-weight: normal; display: block; }
.workslist li a dt { overflow: hidden; }
.workslist li a dt img { width: 100%; transition: .5s; }
.workslist li a dd p { margin-top: .3em; }
.workslist li .update { font-size: .875em; letter-spacing: .15em; }
.workslist li .label { color: #444; line-height: 1em;}
.workslist li .genre { margin-right: .5em; font-size: .875em; font-weight: 600; line-height: 1em; color: #00b097; border-color: #00b097; border-style: solid; border-width: 1px; transition: .5s; }
.workslist li .title { font-size: 1.25em; line-height: 1.2em; font-weight: 600; }
.workslist li .company { width: 100%; padding: .5em 0 0 .125em; color: #444; }
.workslist li .read { margin-top: 1em;color: #444; display: -webkit-box; -webkit-line-clamp: 9; line-clamp: 9; -webkit-box-orient: vertical; overflow: hidden; }
.workslist li a:hover dt { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); transition: 0s; }
.workslist li a:hover dt img { filter: brightness(0.6); transition: 0s; }
.workslist li a:hover { color: #DA2; transition: 0s; }
.workslist li a:hover .genre { color: #DA2; border-color: #DA2; transition: 0s; }
/*-- リスト：大 --*/
.workslist.large { width: 98%; margin: 3em auto 0 auto; }
.workslist.large li { margin-bottom: 1.5em; }
.workslist.large li dl { width: 100%; display: flex; }
.workslist.large li dt { max-width: 900px; width: 60%; }
.workslist.large li dd { width: 38%; margin: 1em 4% 0 1%; }
.workslist.large li .title { margin-bottom: .5em; font-size: 1.5em; line-height: 1.3em; }
.workslist.large li .company { font-weight: 600; }
.workslist.large li a:hover dt img { transform: scale(1.01); transition: transform .3s; }
/*-- リスト：小 --*/
.workslist.small { margin: 3em auto 1em auto; display: flex; flex-wrap: wrap; }
.workslist.small li { max-width: 490px; width: 31.33%; margin: 0 1% 1.5em 1%; }
.workslist.small li a dt { width: 100%; overflow: hidden; transition: .3s; }
.workslist.small li a:hover dt { animation: shake .15s ease-out 2; }
/*-- リスト：中（20240115〜） --*/
.workslist.medium { max-width: 1480px; min-width: 300px; width: 98%; margin: 3em auto 0 auto; }
.workslist .listbody { padding-bottom: 1em; margin-bottom: 1em; border-bottom: #CCC solid .5px; }
.workslist .listbody:last-child { border-bottom: none; }
.workslist .listbody>dl { display: flex; }
.workslist .listbody>dl>dt { max-width: 720px; min-width: 300px; width: 50%; margin: 0 2%; }
.workslist .listbody>dl>dt a:hover img { filter: brightness(0.7) drop-shadow(0 2px 3px rgba(0,0,0,0.3)); animation: shake ease-out .15s; }
.workslist .listbody>dl>dd { width: 50%; padding: .5em 0 0 0; display: flex; flex-direction: column; }
.workslist .listbody h3 a .genre { padding: .25em .75em .125em 2em; font-size: .8em; line-height: 1em; color: #FFF; background-color: #00b097; background-position: left .6em top 50%; background-repeat: no-repeat; border: none; border-radius: .25em; }
.workslist .listbody h3 a .genre.shop { background-image: url(/common/img/ico/ico_shop_white.svg); background-size: 1.125em; }
.workslist .listbody h3 a .genre.office { background-image: url(/common/img/ico/ico_office_white.svg); background-size: 1.125em; }
.workslist .listbody h3 a .genre.logo { background-image: url(/common/img/ico/ico_kaeru_w.svg); background-size: 1.5em; padding-left: 2.25em }
.workslist .listbody h3 a .genre.dtp { background-image: url(/common/img/ico/ico_book_white.svg); background-size: 1.25em; padding-left: 2.25em }
.workslist .listbody h3 a .genre.web { background-image: url(/common/img/ico/ico_mac_white.svg); background-size: 1.25em; padding-left: 2.25em }
.workslist .listbody h3 a .title { margin: .25em 0 1em 0; font-size: 1.5em; }
.workslist .listbody h3 a:hover { animation: shake ease-out .15s; }
.workslist .listbody h3 a:hover .genre { background-color: #DA2; }
.workslist .listbody .info { width: 98%; margin: 0 2% auto 0; font-weight: normal; display: flex; }
.workslist .listbody .info dl { width: 50%; }
.workslist .listbody .info .property { margin-left: 2%; }
.workslist .listbody .info dt { padding: .25em 1em; font-size: .8em; line-height: 1em; color: #888; border-bottom: #CCC solid .5px; }
.workslist .listbody .info dd { padding: .25em 0; color: #666; }
.workslist .listbody .info dd ul { display: flex; flex-wrap: wrap; }
.workslist .listbody .info dd li { margin: 0 0 .5em 2em; list-style: circle; }
.workslist .listbody .company { padding-right: 1em; margin: auto auto 0 0; font-size: 1.25em; font-weight: 600; letter-spacing: .1em; }
.workslist .listbody .company span { margin-left: .25em; font-size: .75em; }
.workslist .listbody a.anchor { width: 100%; padding: 1em; margin: .5em auto 0 auto; background-color: #FFF; border: #00b097 solid 2px; border-radius: .5em; display: flex; }
.workslist .listbody a.anchor .amount { font-weight: 600; }
.workslist .listbody a.anchor .amount .price { font-size: 1.125em; }
.workslist .listbody a.anchor .amount .label, .workslist .listbody a.anchor .amount .yen { margin-right: .5em; font-size: .888em; }
.workslist .listbody a.anchor .more { padding-right: 1em; margin: auto 0 auto auto; font-size: .888em; background-image: url(/common/img/ico/ico_arr_green.svg); background-position: 100% 45%; background-size: .722em; background-repeat: no-repeat; }
.workslist .listbody a:hover.anchor { color: #FFF; background-color: #DA2; border-color: #DA2; filter: drop-shadow(0 2px 3px rgba(0,0,0,0.3)); animation: shake ease-out .15s; }
.workslist .listbody a:hover.anchor .more { background-image: url(/common/img/ico/ico_arr_white.svg); }

/*------------------------------
  制作事例詳細
------------------------------*/
/*-- タイトル --*/
.list_title.detail.works .bar h2 { font-size: 2em; line-height: 1.15em; }
.list_title.detail.works .bar h2 span { margin: .25em 1em 0 0; padding: 0; font-size: .4em; line-height: 1em; vertical-align: top; display: inline-block; }
.list_title.detail.works .bar h2 span.honor { margin-top: .7em }
.list_title.detail.works .bar h2 .genre a { margin: 0; padding: .35em .75em .35em 2.5em; color: #FFF; background-repeat: no-repeat; border: #FFF solid 1px; border-radius: .3em; display: block; }
.list_title.detail.works .bar h2 .genre.shop a { background-image: url(/common/img/ico/ico_shop_white.svg); background-size: 1.5em; background-position: left .75em top 45%; }
.list_title.detail.works .bar h2 .genre.office a { background-image: url(/common/img/ico/ico_office_white.svg); background-size: 1.5em; background-position: left .75em top 45%; }
.list_title.detail.works .bar h2 .genre.logo a { background-image: url(/common/img/ico/ico_kaeru_w.svg); background-size: 1.75em; background-position: left .5em top 45%; }
.list_title.detail.works .bar h2 .genre.dtp a { background-image: url(/common/img/ico/ico_book_white.svg); background-size: 1.5em; background-position: left .75em top 45%; }
.list_title.detail.works .bar h2 .genre.web a { background-image: url(/common/img/ico/ico_mac_white.svg); background-size: 1.5em; background-position: left .6em top 45%; }
.list_title.detail.works .bar h2 .genre a:hover { color: #00b097; background-color: #FFF; }
.list_title.detail.works .bar h2 .genre.shop a:hover { background-image: url(/common/img/ico/ico_shop_green.svg); }
.list_title.detail.works .bar h2 .genre.office a:hover { background-image: url(/common/img/ico/ico_office_green.svg); }
.list_title.detail.works .bar h2 .genre.logo a:hover { background-image: url(/common/img/ico/ico_kaeru_green.svg); }
.list_title.detail.works .bar h2 .genre.dtp a:hover { background-image: url(/common/img/ico/ico_book_green.svg); }
.list_title.detail.works .bar h2 .genre.web a:hover { background-image: url(/common/img/ico/ico_mac_green.svg); }

.list_title.detail.works .bar h2 .honor { margin: 0 0 0 .5em; font-size: .6em; }
.list_title.detail.works .bar .btn_back a { height: 3.5em; line-height: 3.5em; }
/*-- ギャラリー --*/
.works_gallery { width: 100%; margin: 0 auto; position: relative; }
.slide-arrow { width: 60px; height: 90px; padding: 24px 18px; color: #FFF; background-color: rgba(0,0,0,0.6); display: block; opacity: 0.6; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; }
.slide-arrow.prev { border-radius: 0 .5em .5em 0; left: 0; }
.slide-arrow.next { border-radius: .5em 0 0 .5em; right: 0; }
.slide-arrow:hover { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); opacity: 1; }
.slide-arrow:active { background-color: #00b097; box-shadow: 0 1px 6px 0 rgba(0,0,0,0.8); }
.slide-dots { display: flex; justify-content: center; position: absolute; bottom: 1em; left: 50%; transform: translateX(-50%); }
.slide-dots li { margin: 0 1em;  }
.slide-dots li button { width: 1em; height: 1em; color: rgba(255,255,255,0); background-color: rgba(0,0,0,0.6); border-radius: 50%; border:none; outline: none; -webkit-appearance: none; appearance: none; }
.slide-dots .slick-active button { background-color: #00b097; }
/*-- 本文 --*/
.works_detail { width: 96%; margin: 1em auto; }
.works_detail h3 { margin: .75em auto .5em 0; font-size: 2.857em; font-weight: 600; line-height: 1.2em; }
.works_detail .description { display: flex; flex-wrap: wrap; }
.works_detail .description dl { margin: 0 .5em .25em 0; font-size: .875em; border: #00b097 solid 1px; border-radius: .3em; }
.works_detail .description dl.work { max-width: 50%; min-width: 300px; width: auto; }
.works_detail .description dl.property { max-width: 38%; min-width: 300px; width: auto; margin-right: 0; }
.works_detail .description dl:last-child { margin-right: 0; }
.works_detail .description dt { height: 2em; padding: .25em 1.5em .25em 2em; letter-spacing: .2em; text-align: center; color: #FFF; background-color: #00b097; display: inline-block; position: relative; }
.works_detail .description dt::after { content: ""; width: 0; height: 0; border-width: 2em 1em 0 0; border-color: #00b097 transparent transparent #00b097; border-style: solid; position: absolute; top: 0; right: -.986em;  }
.works_detail .description dd { width: 100%; padding: .75em 1em 1em 3em; display: inline-block; }
.works_detail .description dd ul { display: flex; flex-wrap: wrap; }
.works_detail .description dd li { margin: 0 1.25em .25em 0; color: #444; }
.works_detail .description dd a { color: #00b097; font-weight: 600; text-decoration: underline; display: block; }
.works_detail .description dd a:hover { color: #DA2; animation: pyon .15s ease-out 1; }
.works_detail .description dl.property dd li { margin-right: 2.5em; list-style: circle; }
.works_detail .description dl.property dd li span { width: 5em; display: inline-block; }
.works_detail .description dd span:last-child a { margin-right: 0; }
.works_body { max-width: 1080px; width: 94%; margin: 2em auto; font-size: 1.125em; color: #444; }
.works_body h4 { margin: 2em auto .25em auto; font-size: 1.25em; font-weight: 600; line-height: 1.2em; text-align: center; color: #00b097; }
.works_body p { margin: 1.5em auto 2em 1em; line-height: 2em; }
.works_body a, .works_body span { margin: 0 .25em; display: inline-block; }
.works_body a:hover { animation: pyon .15s ease-out 1; }
.works_body figure { max-width: 840px; min-width: 280px; width: 77.77%; margin: 0 auto 1em auto; }
.works_body figure img { width: 100%; }
.works_body .caption { max-width: 840px; min-width: 280px; width: 77.77%; margin: 0 auto 1em auto; color: #00b097; text-align: center; }
.works_body dl { padding: .25em 2%; border-top: #888 solid 1px; border-bottom: #888 solid 1px; }
.works_body dt { margin: .75em 0 1.25em 0; font-size: 1.25em; font-weight: bold; line-height: 1em; color: #00b097; }
.works_body dd { margin: .75em 0; line-height: 1em; }
/*-- その他の制作事例 --*/
.other_works h3.tit { margin: 0 auto; padding: 0; font-size: 2.8em; font-weight: 600; font-family: Helvetica, Arial, sans-serif; line-height: 1.2em; text-align: center; color: #FFF; }
.other_works h3.tit span { font-size: .3em; letter-spacing: .125em; text-align: center; color: #FFF; display: block; }
.other_works ul { max-width: 1260px; min-width: 300px; width: 96%; margin: 1em auto 2em auto; display: flex; flex-wrap: wrap; justify-content: center; }
.other_works ul li { width: 400px; margin: 0 30px 0 0; }
.other_works ul li:last-child { margin-right: 0; }
.other_works a dt img { width: 100%; height: 267px; }
.other_works a:hover dt img { filter: brightness(0.8); animation: shake .15s ease-out 2; } 
.other_works a dd { padding: .5em; font-weight: normal; }
.other_works a dd .genre { padding: .35em .5em .15em 1.75em; margin-right: .5em; font-size: .8em; line-height: 1em; background-size: 1.2em; background-position: left .3em bottom .175em; background-repeat: no-repeat; border: #FFF solid 1px; border-radius: .3em; display: inline-block; }
.other_works a dd .genre.office { background-image: url(/common/img/ico/ico_office_white.svg); }
.other_works a dd .genre.shop { background-image: url(/common/img/ico/ico_shop_white.svg); }
.other_works a dd .genre.logo { padding-left: 2em; background-size: 1.5em; background-image: url(/common/img/ico/ico_kaeru_w.svg); }
.other_works a dd .genre.dtp { background-position: left .3em bottom .125em; background-image: url(/common/img/ico/ico_book_white.svg); }
.other_works a dd .genre.web { background-position: left .3em bottom .125em; background-image: url(/common/img/ico/ico_mac_white.svg); }
.other_works a:hover dd .genre { border-color: #FD6; }
.other_works a:hover dd .genre.office { background-image: url(/common/img/ico/ico_office_yellow.svg); }
.other_works a:hover dd .genre.shop { background-image: url(/common/img/ico/ico_shop_yellow.svg); }
.other_works a:hover dd .genre.logo { background-image: url(/common/img/ico/ico_kaeru_yellow.svg); }
.other_works a:hover dd .genre.dtp { background-image: url(/common/img/ico/ico_book_yellow.svg); }
.other_works a:hover dd .genre.web { background-image: url(/common/img/ico/ico_mac_yellow.svg); }

.other_works a dd .title { font-weight: 600; }



/*------------------------------
  お問合せ
------------------------------*/
.contact_wrap { padding-top: 0; }
.contact_wrap h2 { padding-top: 2em; background-image: url(/common/img/bg_contact_title01.png); background-position: 50% 0; background-repeat: no-repeat; background-size: 8em; }
.contact_wrap h2.send { background-image: url(/common/img/bg_contact_title02.png); background-size: 5em; }
.contac_read { max-width: 42em; width: 90%; margin: 3.75em auto 1.875em auto; color: #444; }
.contact_confirm { width: 25em; padding-left: 2em; margin: 5em auto; font-size: 1.125em; font-weight: 600; color: #00b097; background: url(/common/img/ico/ico_q_green.svg) 0 50% no-repeat; background-size: 1.5em; }
.contact_send { max-width: 680px; min-width: 300px; width: 90%; margin: 6.66em auto; padding-left: 4.66em; color:  #444; background: url(/common/img/ico/ico_mail_airplane_green.svg) 0 0 no-repeat; background-size: 3.66em; }
.contact_send span { margin: 0 .25em; color:  #00b097; }
.contact_redirect { width: 17em; margin: 0 auto; text-align: center; }
.lnk_partner a { width: 20.5em; margin: 0 auto 2.5em auto; text-align: center; border-bottom: #00b097 solid 1px; display: block; }
.lnk_partner a:hover { border-bottom-color: #DA2; animation: shake .15s ease-out 2; }
/*-- メールフォーム --*/
.contact_body { max-width: 846px; min-width: 300px; width: 90%; margin: 0 auto; }
.contact_body form dl { margin-bottom: .625em; display: flex; align-items: center; }
.contact_body form dt { max-width: 136px; width: 7em; margin-right: 10px; font-size: 1.125em; font-weight: 600; line-height: 1.5em; }
.contact_body form dd { max-width: 700px; flex-grow: 2; font-size: 1.25em; font-weight: 600; color: #444; }
.contact_body form dd .error { padding-left: 1.5em; font-size: .75em; color: #DA2; background: url(/common/img/ico/ico_alert_yellow.svg) 0 20% no-repeat; background-size: 1.25em; }
.contact_body form .message dl { margin-top: 1em; display: block; }
.contact_body form .message dt, .contact_body form .message dd { max-width: 846px; width: 100%; }
.contact_body form input[type="text"], .contact_body form textarea { width: 100%; padding: .5em .75em; font-size: 1em; font-weight: 600; color: #444; background-color: #f9f9f9; outline: none; border: #AAA solid 1px; border-radius: .25em; -webkit-appearance: none; appearance: none; }
.contact_body form textarea { height: 11em; }
.contact_body form input[type="text"]::placeholder, .contact_body form textarea::placeholder { font-size: .7em; font-weight: normal; color: #00b097; }
.contact_body form input[type="text"]:focus, .contact_body form textarea:focus { background-color: #FFF; border-color: #00b097; box-shadow: 0 0 .5em 0 rgba(0,176,151,0.5); }
.contact_body .control { margin: 0 0 2em 0; text-align: center; }
.contact_body .control .chkbox { width: 24em; margin: 2.25em auto 1.66em auto; font-size: 1.125em; font-weight: 600; }
.contact_body .control .chkbox:hover { color: #DA2; }
.contact_body .control input[type="submit"] { max-width: 400px; width: 70%; padding: 1em 0; font-size: 1.5em; font-weight: 600; letter-spacing: .25em; line-height: 1.33em; text-align: center; color: #FFF; background-color: #00b097; outline: none; border: #00b097 solid 3px; -webkit-appearance: none; appearance: none; }
.contact_body .control input[type="submit"]:hover { color: #00b097; background-color: #FFF; box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3); animation: shake .15s ease-out 2; }
.contact_body .control input[type="submit"]:disabled { opacity: 0.3; }
.contact_body .control.duo input[type="submit"] { max-width: 355px; margin: 2em 1%; }
.contact_body .control.duo input[type="submit"]:hover { color: #00b097; background-color: #FFF; }
.contact_body .control.duo input[type="submit"].cancel { color: #00b097; background-color: #FFF; }
.contact_body .control.duo input[type="submit"].cancel:hover { color: #FFF; background-color: #00b097; }
/*-- プライバシーポリシー --*/
.contact_wrap .sub_topic>div { width: 100%; height: 30em; padding: 0 1.5em; border: #00b097 solid 1px; overflow-y: scroll; }


/*------------------------------
  協力会社募集中
------------------------------*/
.partner_wrap { padding-top: 0; }
.partner_wrap h2 { max-width: 640px; min-width: 320px; width: 65%; height: 160px; padding: 60px 160px 0 160px; margin: 0 auto; background-image: url(/common/img/bg_partner_title01.png), url(/common/img/bg_partner_title02.png); background-position: 0 50%, 100% 50%; background-repeat: no-repeat; background-size: 160px; }
.partner_read { max-width: 960px; min-width: 300px; width: 80%; margin: 3em auto; line-height: 1.75em; color: #444; }
.partner_read .attention { margin: 1em auto 0 auto; color: #00b097; display: block; }
.partner_contact a { max-width: 560px; min-width: 300px; width: 60%; padding: 1em 0; margin: 1em auto; font-size: 1.25em; font-weight: 600; letter-spacing: .15em; line-height: 1em; text-align: center; color: #FFF; background-color: #00b097; border: #00b097 solid 3px; display: block; }
.partner_contact a:hover { color: #00b097; background-color: #FFF; box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3); animation: shake .15s ease-out 2; }


/*------------------------------
  事業部門のご紹介
------------------------------*/
h2.tit.business span { margin-top: .75em; font-size: .4em; letter-spacing: .5em; }
.division_wrap { width: 100vw; margin: 0 auto; }
.business_read { max-width: 800px; min-width: 300px; width: 80%; margin: 4em auto 1em auto; padding-top: 380px; letter-spacing: .2em; line-height: 2em; text-align: center; color: #444; background: url(/common/img/business_division_202407.png) 50% 0 no-repeat; background-size: 700px; }
.btn_division { max-width: 800px; min-width: 300px; width: 80%; margin: 0 auto 4em auto; display: flex; justify-content: center; flex-wrap: wrap; }
.btn_division li { width: 32%; margin-top: 1em; margin-right: 2%; }
.btn_division li:nth-child(1) { margin-left: 4%; }
.btn_division li:nth-child(2) { margin-right: 4%; }
.btn_division li:last-child { margin-right: 0; }
/*.btn_division li:nth-child(3n+3) { margin-right: 0; }*//*メニューが3の倍数の時*/
.btn_division dt, .btn_division dd, .btn_division li a { font-weight: 600; text-align: center; }
.btn_division dd { font-size: .875em; line-height: 2em; }
.btn_division li a { padding: 1em 0; font-size: 1.25em; line-height: 1em; color: #FFF; background-color: #00b097; border: #00b097 solid 2px; display: flex; justify-content: center; align-items: center; }
.btn_division li a:hover { color: #00b097; background-color: #FFF; box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }
/*-- はたらくカエル --*/
.story { padding-top: 2em !important; }
.story h2 span { font-size: .325em; letter-spacing: .5em; color: #FFF; }
.story .comic { max-width: 1300px; min-width: 300px; width: 90%; margin: 4em auto 2em auto; display: flex; flex-wrap: wrap; flex-direction:row-reverse; }
.story .comic li { width: 49%; margin-bottom: 2em; padding: 4px; border: #FFF solid 3px; position: relative; }
.story .comic li:nth-child(odd) { margin-left: 2%; }
.story .comic li::after { width: 1.5em; height: 1.5em; font-size: 2.25em; font-weight: 600; font-family: Helvetica, Arial, sans-serif; line-height: 1.5em; text-align: center; color: #00b097; background-color: #FFF; display: block; position: absolute; top: 0; left: 0; }
.story .comic li.flame01::after { content: '1'; }
.story .comic li.flame02::after { content: '2'; }
.story .comic li.flame03::after { content: '3'; }
.story .comic li.flame04::after { content: '4'; }
.story .btn_home a { margin: 0 auto 3em auto; color: #FFF; background-color: #00b097; border: #FFF solid 3px; }
.story .btn_home a:hover { color: #00b097; background-color: #FFF; }
/*-- 部署紹介 --*/
.division_card { max-width: 1500px; min-width: 320px; width: 100%; padding-top: 0; margin: 0 auto; }
.division_card#planning { margin-bottom: 120px; }
.bn_division { padding: 2em 0 0; position: relative; }
.bn_division::before { content: ""; width: 100%; height: 5px; background-color: #00b097; position: absolute; left: 0; bottom: 39px; }
.bn_division img { width: 1040px; margin-left: auto; position: relative; z-index: 10; }
.division_card:nth-of-type(even) .bn_division img { margin-left: 0; }
.division_card dl { max-width: 1400px; min-width: 300px; width: 98%; margin: 2em auto 1em; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; }
.division_card dt { max-width: 640px; width: 45%; }
.division_card dd { width: 50%; margin: 0 3% 0 2%; }
.division_card dd p.division_text { letter-spacing: .2em; line-height: 2em; color: #444; }
.division_card dd .service { margin: 2em auto 0 auto; display: flex; flex-wrap: wrap; }
.division_card dd .btn_link { width: 80%; max-width: 470px; min-width: 240px; margin: 2em auto 0; }
.division_card dd .btn_link a { padding: .5em; font-size: 1.25em; font-weight: 600; letter-spacing: .2em; text-align: center; color: #00b097; border: #00b097 solid 2px; display: block; }
.division_card dd .btn_link a:hover { color: #FFF; background-color: #00b097; box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }


/*------------------------------
  事業部門詳細
------------------------------*/
.division_detail_wrap h2 { width: 100%; max-width: 1040px; min-width: 300px; margin: 0 auto; position: relative; }
.division_detail_wrap h2::before { content: ""; width: calc(50vw - 50%); height: 5px; background-color: #00b097; position: absolute; bottom: 39px; left: calc(-50vw + 50%); }
.division_detail_wrap h2::after { content: ""; width: calc(50vw - 50%); height: 5px; background-color: #00b097; position: absolute; bottom: 39px; right: calc(-50vw + 50%); }
.division_d_head { margin: 5em 0 6em; }
.division_d_head dt h3 { padding: 0 1em; font-size: 2em; letter-spacing: 0.1em; text-align: center; }
.division_d_head dt p { width: 90%; max-width: 800px; min-width: 300px; height: 360px; max-height: 400px; margin: 1em auto 0; font-size: 2em; font-weight: 600; line-height: 1.7; letter-spacing: .1em; color: #444; display: flex; flex-direction: column; justify-content: center; }

.interior .division_d_head dt p { background: url(/common/img/d_interior_cover.jpg) no-repeat 100% 50%; background-size: contain; }
.facility .division_d_head dt p { background: url(/common/img/d_facility_cover.jpg) no-repeat 100% 50%; background-size: contain; }
.estate .division_d_head dt p { background: url(/common/img/d_estate_cover.jpg) no-repeat 100% 50%; background-size: contain; }
.creative .division_d_head dt p { background: url(/common/img/d_creative_cover.jpg) no-repeat 100% 50%; background-size: contain; }
.planning .division_d_head dt p { background: url(/common/img/d_planning_cover.jpg) no-repeat 100% 50%; background-size: contain; }
.division_d_head dt p .accent_g { font-size: 1.25em; color: #00b097; }
.division_d_head dd { width: 90%; max-width: 800px; min-width: 300px; margin: 3em auto 0; }
.division_d_head dd p { color: #444; font-size: 1.125em; line-height: 1.75; letter-spacing: .1em; text-align: center; }
/*-- 他部門へのリンク --*/
.other_division_link { padding: 3.5em 0 5em; }
.other_division_link .aside_tit { margin: 0 0 1.5em; font-size: 1.25em; font-weight: 600; text-align: center; }
.other_division_link ul { width: 90%; max-width: 780px; margin: 0 auto; display: flex; }
.other_division_link li { width: 25%; height: 60px; }
.other_division_link li:nth-child(n+2) a { border-left: none; }
.other_division_link li a { width: 100%; height: 100%; color: #FFF; text-align: center; border: 2px solid #FFF; display: flex; justify-content: center; align-items: center; }
.other_division_link li a:hover { color: #00b097; background-color: #FFF; animation: shake .15s linear 3; }
/*-- サービス紹介 --*/
.division_service { margin: 6em 0 3em; }
.division_service h3 { font-size: 2em; letter-spacing: 0.1em; text-align: center; }
.division_service ul { width: 90%; max-width: 1500px; min-width: 300px; margin: 5em auto 0; }
.division_service ul { width: 90%; max-width: 1500px; min-width: 300px; margin: 5em auto 0; }
.division_service li h4 { padding: .1em 3% .1em calc(3% + 1.6em); font-size: 2.25em; color: #FFF; background: url(/common/img/ico/ico_kaeru_w.svg) no-repeat 3% .35em #00b097; background-size: 1.3em auto; }
.division_service li dl { padding: 3em 1% 5em; display: flex; }
.division_service li:nth-child(even) dl { flex-direction: row-reverse; }
.division_service li dt { width: 45%; max-width: 640px; margin: 0 2%; }
.division_service li dd { width: 55%; margin: 0 2%; display: flex; flex-direction: column; }
.division_service li dd h5 { margin-top: .5em; font-size: 1.5em; }
.division_service li dd .sentence { margin: 1.75em 0 3em; font-size: 1em; line-height: 2; letter-spacing: .2em; color: #444; }
.division_service li dd .btn_link { width: 80%; max-width: 470px; min-width: 240px; margin: auto auto 1.6em; }
.division_service li dd .btn_link a { padding: .5em; font-size: 1.25em; font-weight: 600; letter-spacing: .2em; text-align: center; color: #00b097; border: #00b097 solid 2px; display: block; }
.division_service li dd .btn_link a:hover { color: #FFF; background-color: #00b097; box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }

/*------------------------------
  企業情報
------------------------------*/
.company_wrap { padding-top: 0; }
/*-- 代表挨拶 --*/
.ceo_wrap { width: 100%; padding: 0; }
.ceo_body { max-width: 1500px; min-width: 1200px; width: 96%; height: 1050px; margin: 0 auto; background: url(/common/img/ceo.jpg) 100% 100% no-repeat; background-size: 748px; position: relative; }
.ceo_body .ceo_title { max-width: 450px; }
.ceo_body .ceo_voice { margin: 40px auto 60px 0; font-size: 2.625em; font-weight: 600; text-shadow: 0 2px 6px #00b097, 0 -2px 6px #00b097, 2px 0 6px #00b097, 2px 2px 6px #00b097, 2px -2px 6px #00b097, -2px 0 6px #00b097, -2px 2px 6px #00b097, -2px -2px 6px #00b097; }
.ceo_body .ceo_voice span { line-height: 1.2em; display: block; }
.ceo_body .ceo_read { width: 32em; margin: 0 auto 4em 3em; font-size: 1.125em; letter-spacing: .2em; }
.ceo_body .ceo_read span { line-height: 2.4em; display: block; }
.ceo_body .btn_division2 { width: 760px; display: flex; flex-wrap: wrap; justify-content: center; }
.ceo_body .btn_division2 li { max-width: 240px; width: 32%; margin-right: 2%; margin-bottom: 2%; }
.ceo_body .btn_division2 li:first-child { margin-left: 2%; }
.ceo_body .btn_division2 li:last-child { margin-right: 0; }
.ceo_body .btn_division2 dt a { padding: .5em 0; font-size: 1.25em; font-weight: 600; text-align: center; color: #FFF; background-color: #00b097; border: #FFF solid 2px; display: block; }
.ceo_body .btn_division2 dt a:hover { color: #00b097; background-color: #FFF; box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }
.ceo_body .btn_division2 dd { margin-top: .5em; font-size: .875em; text-align: center; }
.ceo_body .name { text-shadow: 0 2px 2px #00b097, 0 -2px 2px #00b097, 2px 0 2px #00b097, 2px 2px 2px #00b097, 2px -2px 2px #00b097, -2px 0 2px #00b097, -2px 2px 2px #00b097, -2px -2px 2px #00b097; position: absolute; bottom: 1em; right: 17em; }
.ceo_body .name .title { margin-right: 1em; font-size: .875em; }
/*-- 企業理念 --*/
.philosophy_tile { max-width: 1500px; min-width: 300px; width: 90%; margin: 2em auto; display: flex; flex-wrap: wrap; }
.philosophy_tile li { width: 48%; height: 26em; margin: 0 2% 1.5em 0; padding: 1.5em; border: #00b097 solid 1px; border-radius: .5em; }
.philosophy_tile li:nth-child(even) { margin-right: 0; }
.philosophy_tile h4 { font-size: 2.625em; font-weight: 600; font-family: Helvetica, Arial, sans-serif; line-height: 1em; }
.philosophy_tile h4 span { font-size: .4em; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','メイリオ', 'Meiryo', '游ゴシック', 'Yu Gothic', 'ＭＳ Ｐゴシック', sans-serif; letter-spacing: .2em; line-height: 1.5em; display: block; }
.philosophy_tile li.mission { background: url(/common/img/bg_philosophy01.png) 100% 0 no-repeat; background-size: 50%; }
.philosophy_tile li.vision { background: url(/common/img/bg_philosophy02.png) 100% 0 no-repeat; background-size: 50%; }
.philosophy_tile li.value { background: url(/common/img/bg_philosophy03.png) 100% 0 no-repeat; background-size: 60%; }
.philosophy_tile li.way { background: url(/common/img/bg_philosophy04.png) 0 100% no-repeat; background-size: 50%; }
.philosophy_tile li p { font-size: 1.25em; font-weight: 600; line-height: 2em; }
.philosophy_tile li.mission p { margin: 3em auto; }
.philosophy_tile li.vision p { margin: 3em auto; }
.philosophy_tile li.value p { margin: 4em auto; }
.philosophy_tile li.way p {  width: 13.2em; margin: 0 0 0 auto;}
/*-- 会社概要 --*/
.profile_list { max-width: 1040px; min-width: 300px; width: 80%; margin: 2em auto; }
.profile_list dl { border-width: 1px 1px 0 1px; border-color: #FFF; border-style: solid; display: flex; align-items: center; }
.profile_list dl:last-child { border-bottom-width: 1px; }
.profile_list dt { width: 14em; }
.profile_list dd { width: calc(100% - 14em); border-left: #fff solid 1px; }
.profile_list dt p, .profile_list dd p { padding: 1em; line-height: 1.2em; }
.profile_list dt p { text-align: center; }
.profile_list dd p .zip { margin-right: .5em; font-size: .875em; }
.profile_list dd p .map { width: 1.5em; height: 1.2em; margin-left: 1em; display: inline-block; }
.profile_list dd p .map:hover { animation: pyon .3s ease-out 1; }
.profile_list dd p .map:hover img { filter: drop-shadow(0 1px 3px rgba(0,0,0,0.3)); }
.profile_list p .caption { margin-left: 1em; font-size: .8em; }
.profile_list .icons { margin: 1em 0 -1em 0; display: flex; flex-wrap: wrap; }
.profile_list .icons li { max-width: 10em; width: auto; margin-right: 2%; }
.profile_list .icons li img { height: 5em; margin: 0 auto; object-fit: contain; }
.profile_list .icons li.usen img { width: 10em; }
.profile_list .icons li p { margin: 0; font-size: .8em; line-height: 1.2em; text-align: center; }
.profile_list .map_add { width: 100%; padding: .25em; display: flex; justify-content: space-between; align-items: center; }
.profile_list .map_add a.map_large { width: 21em; display: block; overflow: hidden; position: relative; display: block; }
.profile_list .map_add a.map_large::after { content: ''; width: 2.5em; height: 2.125em; background-color: #FFF; background-image: url(/common/img/ico/ico_map_green.svg); background-position: 50% 50%; background-repeat: no-repeat; background-size: 1.5em; border-radius: .5em; display: block; position: absolute; bottom: 0; left: 0; }
.profile_list .map_add a.map_large img { transition: .3s;  }
.profile_list .map_add a.map_large:hover img { opacity: 0.8; transform: scale(1.03); transition: .15s; }
.profile_list .map_add a.map_large:hover::after { box-shadow: 0 1px 5px 0 rgba(0,0,0,0.3); bottom: .1em; left: .1em; transform: scale(1.05); animation: pyon .3s ease-out 1; }
/*-- 沿革 --*/
.history { background-image: url(/common/img/bg_ruler_green.png), url(/common/img/bg_history.png); background-position: 0 0, 100% 2%; background-repeat: repeat-y, no-repeat; background-size: 20px, 250px; }
.history_list { max-width: 1040px; min-width: 300px; width: 80%; margin: 2em auto 6em auto; }
.history_list li { font-weight: 600; border-bottom: #00b097 solid 2px; }
.history_list dl { display: flex; }
.history_list dt { width: 14em; padding: 1em; }
.history_list dd { width: calc(100% - 14em); padding: 1em; }
.history_list dt p, .history_list dd p { line-height: 1.2em; }
.history_list dt p { text-align: center; }
.history_list dd p { color: #444; display: flex; }
.history_list dd p .month { width: 3em; }

/*------------------------------
  組織図・グループ企業
------------------------------*/
/*-- カエル・デザイン・プロジェクト組織図 --*/
.chart_wrap { padding-bottom: 5em; background-image: url(/common/img/ico/ico_down_green.svg); background-position: left 50% bottom 3.75em; background-repeat: no-repeat; background-size: 1.5em; }
.company_chart { max-width: 1496px; width: 90%; margin: 1em auto; position: relative; z-index: 10; }
.company_chart::after { content: ''; width: 18.75vw; height: 11.979vw; background: url(/common/img/bg_company_chart.png) 0 0 no-repeat; background-size: 100%; display: block; position: absolute; right: -3.65vw; top: -5.73vw; z-index: -1; }
/*-- グループ企業 --*/
.group_wrap { padding-bottom: 8em; background-image: url(/common/img/bg_group.png); background-position: 0 0; background-repeat: no-repeat; background-size: 10.42vw; }
.group_list { max-width: 1300px; width: 90%; margin: 1em auto; }
.group_list li { padding: 2em; border-bottom: #FFF solid 2px; }
.group_list li dl { display: flex; align-items: center; }
.group_list li dt { width: 280px; }
.group_list li dd { width: calc(100% - 280px); padding-left: 1em; }
.group_list li dd p { margin-bottom: .5em; }
.group_list li dd .title { font-size: .875em; }
.group_list li dd .title span { margin-left: 1em; padding: .25em 1em; font-weight: 600; border: #FFF solid 1px; }
.group_list li dd .name { margin: 0; font-weight: 600; letter-spacing: .3em; }
.group_list li dd .companyname { margin: .5em 0 0 .2em; font-size: 2.25em; }
.group_list li dd .add { padding-left: 1em; font-weight: 600; letter-spacing: .3em; }
.group_list li dd .zip { margin-right: 1em; font-size: .875em; }
.group_list li dd .description { padding-left: 1em; }
.group_list li dd .link a { width: 10em; padding-left: 1.25em; font-weight: 600; line-height: 2.2em; text-align: center; color: #FFF; background-color: #00b097; background-image: url(/common/img/ico/ico_out_white.svg); background-position: left 1em top 40%; background-repeat: no-repeat; background-size: 1.125em; border: #FFF solid 2px; display: block; }
.group_list li dd .link a:hover { color: #00b097; background-color: #FFF; background-image: url(/common/img/ico/ico_out_green.svg); box-shadow: 0 1px 5px rgba(0,0,0,0.3); animation: pyon .3s 1; }


/*------------------------------
  サービスメニュー
------------------------------*/
.service_wrap { padding: 2em 0 5em 0; background-image: url(/common/img/bg_service_list02.png); background-position: 100% 100%; background-repeat: no-repeat; background-size: 300px; }
.service_wrap h2.tit { width: 680px; padding: .5em 0 1em 0; margin: 0 auto; background: url(/common/img/bg_service_list01.png) 0 0 no-repeat; background-size: 240px; }
.service_read { text-align: center; color: #444; }
.service_list { max-width: 1500px; min-width: 300px; width: 80%; margin: 3em auto 4em auto; display: flex; flex-wrap: wrap; }
.service_list li { width: 32%; margin: 0 2% 1.5em 0; }
.service_list li:nth-child(3n+3) { margin-right: 0; }
.service_list dt { margin-bottom: .1em; font-size: 1.125em; font-weight: 600; line-height: 1em; }
.service_list dt .frame { margin-right: .5em; padding: 0 .3em 0 .5em; font-size: .8em; font-weight: normal; letter-spacing: .2em; line-height: 1.406em; color: #FFF; background-color: #00b097; display: inline-block; vertical-align: bottom; }
.service_list dd a { border: #00b097 solid 2px; display: block; position: relative; }
.service_list dd a img { width: 100%; transition: all .5s; }
.service_list dd a .on { position: absolute; top: 0; left: 0; opacity: 0; }
.service_list dd a:hover { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3); animation: shake .15s ease-out 2; }
.service_list dd a:hover .on { opacity: 1; transition: .25s; }


/*------------------------------
  サービス詳細
------------------------------*/
.service_detail_wrap { padding-top: 0; }
/*-- タイトルバー --*/
.list_title.service { max-width: 1500px; min-width: 320px; width: 94%; margin: 0 auto; }
.list_title.service>p { padding: 1em 540px 0 0; background-position: right 0 bottom .3em; background-repeat: no-repeat; background-size: 540px; }
.list_title.service>p.interior { background-image: url(/common/img/bg_service_detail01.png); }
.list_title.service>p.electric { background-image: url(/common/img/bg_service_detail02.png); }
.list_title.service>p.creative { background-image: url(/common/img/bg_service_detail03.png); }
.list_title.detail.service .bar h2 { font-size: 2em; line-height: 1.15em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.list_title.detail.service .bar h2 span { display: inline-block; }
.list_title.detail.service .bar h2 .frame { margin: .25em 0 0 1em; padding: .25em .75em; font-size: .4em; border: #FFF solid 1px; vertical-align: top; }
.list_title.detail.service .bar h2 .honor { margin: 0 0 0 .5em; font-size: .6em; }
.list_title.detail.service .bar .btn_back a { height: 3.5em; line-height: 3.5em; }
/*-- 本文構造 --*/
.service_detail_body { width: 100%; margin: 2em auto; font-size: 1.125em; color: #444; }
.service_detail_body .service_head, .service_detail_body .service_foot { max-width: 1300px; min-width: 300px; width: 90%; display: block; }
.service_detail_body .service_head, .service_detail_body .service_foot figure { margin-bottom: 2em; }
.service_detail_body .service_head { margin: 0 auto; }
.service_detail_body .contents { margin: 0 auto 2em auto; }
.service_detail_body .service_foot { margin: 5em auto 0 auto; padding: 2em 2% 0 2%; border-top: #00b097 solid 2px; }
.service_detail_body .service_foot.consultant { margin: 0 auto; }
.service_detail_body .service_foot .caution { font-size: .8em; color: #00b097; }
.service_detail_body .contents a, .service_detail_body .service_foot a { margin: 0 .25em; display: inline-block; }
.service_detail_body .service_foot .annotation { margin-top: .5em; font-size: .8em; color: #00b097; }
.service_detail_body .contents .deco_catch { max-width: 1300px; min-width: 320px; width: 90%; margin: 1em auto 0; font-size: 3.5em; font-weight: 600; letter-spacing: .05em; color: #00b097; }
.service_detail_body .contents .estate .deco_catch { width: 80%; margin: .5em auto 0; line-height: 1.5; }
.service_detail_body .contents .deco_catch span { font-size: 0.75em; }
.service_detail_body .contents .deco_catch span.small { font-size: .33em; font-weight: normal; line-height: 1.8; letter-spacing: .05em; display: block; }
/*-- 冒頭文 --*/
.service_detail_body .service_head dt { width: 480px; }
.service_detail_body .service_head dt p { width: 98%; margin: 1em auto 0 auto; font-size: .9em; text-indent: 1em; }
.service_detail_body .service_head .left_head dt { margin: 0 1.5em 1em 0; float: left; }
.service_detail_body .service_head .right_head dt { margin: 0 0 1em 1.5em; float: right; }
.service_detail_body .service_head .left_head.oa dt { width: 30%; }
.service_detail_body .service_head dd { padding: 1em 1em 0 0; letter-spacing: .1em; line-height: 1.75em; text-indent: 1em; }
.service_detail_body .service_head dd h4 { font-size: 1.77em; font-weight: 600; line-height: 1.2em; text-indent: 0; color: #00b097; }
.service_detail_body .service_head dd p { margin: 1em auto; }
.service_detail_body .service_head dd figure { max-width: 1200px; min-width: 300px; width: 80%; margin: 1em auto; border-radius: .5em; overflow: hidden; }
.service_detail_body .service_head dd.suggest { padding: 1.5em 3%; text-indent: 0; color: #FFF; background-color: #00b097; border-radius: .75em; float: left; }
.service_detail_body .service_head dd.suggest h4 { margin: 0 0 0 1.789em; font-size: 2em; font-weight: 600; color: #FFF; }
.service_detail_body .service_head dd.suggest h4::first-letter { margin-right: 100%; margin-bottom: -999em; float: right; line-height: 1; font-size: 1.789em; }
.service_detail_body .service_head dd.suggest p { text-indent: 1em; }
.service_detail_body .service_head dd.suggest.office-moving h4 { margin-bottom: 1em; }
.service_detail_body .service_head dd.suggest.interior-design h4 { float: left; }
.service_detail_body .service_head dd.suggest.interior-design p { margin: 0 auto; float: left; }
.service_detail_body .service_head dd.suggest.interior-design .copy { margin: 1em auto; font-size: 1.5em; font-weight: 600; line-height: 1em; text-indent: 0; color: #FD6; float: right; }
.service_detail_body .service_head dd.suggest.oa { width: calc(70% - 1.5em); }
.service_detail_body .service_head dd.suggest.oa h4 { margin-bottom: 1em; }
/*-- プログラム --*/
.service_detail_body .contents .program { max-width: 1300px; min-width: 300px; width: 90%; margin: 0 auto; padding-top: 80px; }
.service_detail_body .contents .program.flow { padding-bottom: 2.5em; background: url(/common/img/ico/ico_down_green.svg) 50% 100% no-repeat; background-size: 1.5em; }
.service_detail_body .contents .program.flow:last-child { padding-bottom: 0; background: none; }
.service_detail_body .contents .program.consultant { padding: 60px 0 40px; border-bottom: #00b097 solid 2px; }
.service_detail_body .contents .program.consultant:last-child { border-bottom: none; }
.service_detail_body .contents .program.estate { padding: 40px 0 40px; }
.service_detail_body .contents .program.estate:first-child { padding-top: 0; }
.service_detail_body .contents .program.estate:last-child { padding: 40px 0 0; }
.service_detail_body .contents .program.lr { display: flex; align-items: center; flex-wrap: wrap; }
.service_detail_body .contents .program.lr .text { width: 50.77%; }
.service_detail_body .contents .program.lr.consultant .text { width: 100%; }
.service_detail_body .contents .program.estate .text { width: 100%; }
.service_detail_body .contents .program.estate .text .introduction { width: 80%; margin: 0 auto; padding: 1em 0 0; }
.service_detail_body .contents .program.lr figure { max-width: 640px; width: 49.23%; border-radius: .5em; overflow: hidden; }
.service_detail_body .contents .program h3 { margin: .25em 0; font-size: 2em; font-weight: 600; line-height: 1.2em; color: #00b097; }
.service_detail_body .contents .program.estate h3:only-child { margin: 0 auto; padding: 0 calc(10%/6); }
.service_detail_body .contents .program h3 span { margin-top: .2em; font-size: .5em; font-weight: normal; line-height: 2em; display: inline-block; vertical-align: top; }
.service_detail_body .contents .program h3 span.round { padding: 0 1.5em 0 1em; margin-right: .5em; color: #FFF; background-color: #00b097; border-radius: 0 1em 1em 0; }
.service_detail_body .contents .program.estate h3 span.round { font-size: .89em; font-weight: 600; }
.service_detail_body .contents .program h3 span.step { padding: 0 .5em 0 1em; margin-right: 1em; color: #FFF; background-color: #00b097; position: relative; }
.service_detail_body .contents .program h3 span.step::after { content: ''; width: 0; height: 0; border-width: 0 0 2em .8em; border-color: transparent transparent transparent #00b097; border-style: solid; position: absolute; top: 0; right: -.75em; }
.service_detail_body .contents .program h3 span.price { margin-left: 1em; padding: 0 .5em 0 1.125em; font-size: .45em; line-height: 2em; border: #00b097 solid 1px; }
.service_detail_body .contents .program h3 span.price span { font-size: 1.25em; font-weight: 600; line-height: 1.44em; }
.service_detail_body .contents .program .copy { margin: 1.25em .5em .5em 1em; font-size: 1.33em; font-weight: 600; line-height: 1em; color: #00b097; }
.service_detail_body .contents .program .copy span { font-size: .5833em; font-weight: normal; line-height: 1.75em; display: block; }
.service_detail_body .contents .program p { height: calc(100% - 3.375em); padding: 1em 2em 1em 1.5em; letter-spacing: .1em; line-height: 1.75em; border-left: #00b097 solid 3px; }
.service_detail_body .contents .program.consultant p { min-height: 243px; margin-top: 1.5em; padding: 1em 440px 1em 1em; border-left: none; background-repeat: no-repeat; background-size: 500px auto; background-position: 100% 0; }
.service_detail_body .contents .program.estate p { padding: 0; border-left: none; }
.service_detail_body .contents .program.estate p.add_catch { margin: 2.5em 0 0; font-size: 1.25em; color: #00b097; text-align: center; }
.service_detail_body .contents .program.estate p.closing_catch { width: 80%; margin: 1.5em auto 0; font-size: 1em; }
.service_detail_body .contents .program.plan p { background-image: url(/common/img/s11_plan.jpg); }
.service_detail_body .contents .program.marketing p { background-image: url(/common/img/s11_marketing.jpg); }
.service_detail_body .contents .program.realestate p { background-image: url(/common/img/s11_realestate.jpg); }
.service_detail_body .contents .program.handshake p { background-image: url(/common/img/s11_handshake.jpg); }
.service_detail_body .contents .program.signbord p { background-image: url(/common/img/s11_signbord.jpg); }
.service_detail_body .contents .program p .list { padding-left: 1em; margin: 1em auto .5em auto; font-size: .875em; line-height: 2em; display: block; }
.service_detail_body .contents .program.estate .text ul { width: 80%; margin: 1em auto 0; display: flex; flex-wrap: wrap; }
.service_detail_body .contents .program.estate .text li { margin: 0 .5em .5em 0; padding: 0 .5em; font-size: 1.25em; line-height: 2; color: #FFF; background-color: #00b097; display: inline-block; }
.service_detail_body .contents .program.estate .text li:last-child { color: #00b097; background-color: transparent; border: 1px solid #00b097; }
.service_detail_body .contents .program .target { max-width: 900px; margin: .5em 1em 0 0; color: #00b097; background-color: #FFF; border: #00b097 solid 1px; display: flex; align-items: flex-start; }
.service_detail_body .contents .program .target dt { width: 7.5em; padding: 0 0 0 2.2em; margin-right: 1em; line-height: 2em; color: #FFF; background: #00b097 url(/common/img/ico/ico_target_white.svg) left .5em top 40% no-repeat; background-size: 1.5em; position: relative; }
.service_detail_body .contents .program .target dt::after { content: ''; width: 0; height: 0; border-width: 0 0 2em .8em; border-color: transparent transparent transparent #00b097; border-style: solid; position: absolute; top: 0; right: -.75em; }
.service_detail_body .contents .program .target dd { font-weight: 600; width: calc(100% - 7.5em); padding: .4em 0; line-height: 1.2em; }
.service_detail_body .contents .program .information { max-width: 900px; margin: .5em 1em 0 0; padding: .5em .25em .5em 3.25em; font-weight: 600; line-height: 1em; color: #FFF; background: #00b097 url(/common/img/ico/ico_info_white.svg) left .75em top 50% no-repeat; background-size: 2em; }
.service_detail_body .contents .program .information span { color: #FD6; }
.service_detail_body .contents .program .point { width: 92%; margin: 1.5em 6% 0 2%; padding: 1.5em 1.5em 1em 1.5em; font-size: .888em; font-weight: 600; color: #00b097; background-color: #FFF; border: #00b097 solid 2px; border-radius: .5em; position: relative; }
.service_detail_body .contents .program .point::after { content: ''; width: 3em; height: 2.4em; background: #FFF url(/common/img/ico/ico_kaeru_green.svg) 50% 50% no-repeat; background-size: 2.5em; position: absolute; left: 1em; top: -1.5em; }
.service_detail_body .contents .program .detail { width: 100%; display: flex; flex-wrap: wrap; }
.service_detail_body .contents .program .detail li { margin: 1.5em 2% 0 0; padding: 1em; border: #00b097 solid 2px; border-radius: .5em; display: block; }
.service_detail_body .contents .program .detail.d2 li { width: 49%; }
.service_detail_body .contents .program .detail.d2 li:nth-child(even) { margin-right: 0; }
.service_detail_body .contents .program .detail.d3 li { width: 32%; }
.service_detail_body .contents .program .detail.d3 li:nth-child(3n+3) { margin-right: 0; }
.service_detail_body .contents .program .detail li h4 { font-size: 1.25em; font-weight: 600; color: #00b097; }
.service_detail_body .contents .program .detail li figure { border-radius: .3em; overflow: hidden; }
.service_detail_body .contents .program .detail li p { height: auto; padding: 0; margin: 1em auto; font-size: .88em; border: none; }
.service_detail_body .contents .program.estate .support_list { margin-top: 2em; display: flex; flex-wrap: wrap; }
.service_detail_body .contents .program.estate .support_list li { width: 30%; margin: calc(10%/6); border: 1px solid #00b097; }
.service_detail_body .contents .program.estate .support_list dl { position: relative; }
.service_detail_body .contents .program.estate .support_list.three_point dt figure { position: relative; overflow: hidden; }
.service_detail_body .contents .program.estate .support_list.three_point dt figure::before { content: ""; width: 8em; height: 8em; background-color: #00b097; border-radius: 50%; position: absolute; top: -4em; left: -4em; }
.service_detail_body .contents .program.estate .support_list.three_point dt figure::after { content: "★"; color: #FFF; font-size: 1.5em; position: absolute; top: .5em; left: .5em; }
.service_detail_body .contents .program.estate .support_list dd.support_text { margin: -9em 0 0; padding: 9em 1em 1em; background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8) 6em, rgba(255, 255, 255, 1) 9em); position: relative; z-index: 10; }
.service_detail_body .contents .program.estate .support_list.three_point dd.support_text { margin: 0; padding: .5em; background-image: none; }
.service_detail_body .contents .program.estate .support_list dd.support_text h4 { font-size: 1.25em; font-weight: 600; line-height: 1.3; color: #00b097; }
.service_detail_body .contents .program.estate .support_list.three_point dd.support_text h4 { font-size: 1.5em; text-align: center; }
.service_detail_body .contents .program.estate .support_list dd.support_step { padding: .5em 2em; font-size: .89em; font-weight: 600; letter-spacing: .1em; line-height: 1; color: #FFF; background-color: #00b097; border-radius: 0 3em 3em 0; position: absolute; left: -1px; top: calc(-1em + 1px); }
.service_detail_body .contents .program .btn_link a { padding: .5em 2em .5em 1em; margin-left: 2%; color: #00b097; background-color: #FFF; background-image: url(/common/img/ico/ico_arr_green.svg); background-position: right .5em top 50%; background-repeat: no-repeat; background-size: .8em; border: #00b097 solid 2px; border-radius: .5em; display: inline-block; }
.service_detail_body .contents .program .detail li .btn_link a { font-size: 1.125em; }
.service_detail_body .contents .program .btn_link a:hover { color: #FFF; background-color: #00b097; background-image: url(/common/img/ico/ico_arr_white.svg); box-shadow: 0 1px 6px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }
.service_detail_body .contents .program .point .link_list { width: 100%; display: flex; flex-wrap: wrap; }
.service_detail_body .contents .program .point .link_list .btn_link a { width: 13em; margin-top: 1em; font-size: 1.125em; }
.service_detail_body .contents .program.consultant .link_list, .service_detail_body .contents .program.estate .link_list { width: fit-content; margin: 2em auto 0; display: flex; flex-wrap: wrap; justify-content: center; }
.service_detail_body .contents .program.estate .link_list { margin: .5em auto 0; justify-content: center; }
.service_detail_body .contents .program.consultant .link_list .btn_link a, .service_detail_body .contents .program.estate .link_list .btn_link a { width: 13em; margin-top: 2%; font-size: 1.125em; text-align: center; }
/*-- サブコラム --*/
.service_detail_body .contents .qualification { max-width: 1300px; min-width: 300px; width: 90%; margin: 0 auto; margin: 4em auto; padding: 1em; font-weight: 600; color: #FFF; background-color: #00b097; border-radius: .75em; }
.service_detail_body .contents .qualification h4 { letter-spacing: .1em; line-height: 3em; text-align: center; }
.service_detail_body .contents .qualification h4 span { margin-left: 1em; font-size: .75em; font-weight: normal; letter-spacing: 0; }
.service_detail_body .contents .qualification ul { display: flex; flex-wrap: wrap; justify-content: center; }
.service_detail_body .contents .qualification li { margin: 0 0 .5em 3em; list-style: disc; }
.service_detail_body .contents .achievement { max-width: 700px; width: 100%; margin: 0 auto 3em auto; }
.service_detail_body .contents .achievement h4 { width: 11em; margin: 0 auto; padding-left: 2em; font-size: 1.66em; font-weight: 600; letter-spacing: .15em; line-height: 2em; color: #00b097; background: url(/common/img/ico/ico_kaeru_green.svg) 0 30% no-repeat; background-size: 1.6em; }
.service_detail_body .contents .achievement>div { padding: 1em 1.5em; display: flex; justify-content: center; }
.service_detail_body .contents .achievement dl:first-child { margin-right: 4em; }
.service_detail_body .contents .achievement dt { margin-bottom: .5em; font-weight: 600; letter-spacing: .2em; line-height: 2em; text-align: center; color: #FFF; background-color: #00b097; border-radius: .5em; }
.service_detail_body .contents .achievement dd { padding: .25em .5em .25em 1em; }
.service_detail_body .contents .description { max-width: 1274px; min-width: 300px; width: 86%; margin: .5em auto 0 auto; padding: 1.5em 2%; border:  #00b097 solid 2px; border-radius: .75em; }
.service_detail_body .contents .description.white { background-color: #FFF; }
.service_detail_body .contents .description.green { color: #FFF; background-color: #00b097; }
.service_detail_body .contents .description h4 { margin-bottom: .5em; padding-left: 2.4em; font-size: 1.33em; font-weight: 600; letter-spacing: .2em; line-height: 2em; color: #00b097; background-position: 0 30%; background-repeat: no-repeat; background-size: 2em; }
.service_detail_body .contents .description.white h4 { color: #00b097; background-image: url(/common/img/ico/ico_kaeru_green.svg); }
.service_detail_body .contents .description.green h4 { color: #FFF; background-image: url(/common/img/ico/ico_kaeru_w.svg); }
.service_detail_body .contents .description>div { display: flex; flex-wrap: wrap; }
.service_detail_body .contents .description.logo>div { align-items: center; }
.service_detail_body .contents .description.logo figure { width: 36%; }
.service_detail_body .contents .description.logo figcaption { width: 64%; padding-left: 2em; }
.service_detail_body .contents .description.logo figcaption p { margin: .25em 0; }
.service_detail_body .contents .description.logo figcaption p.subtitle { margin-top: .5em; font-weight: 600; color: #00b097; }
.service_detail_body .contents .description.sign figure { width: 48%; margin: 0 1%; }
.service_detail_body .contents .description.sign figcaption { width: 100%; margin-bottom: 1em; padding-left: 2em; }
.service_detail_body .contents .description.oa figure { max-width: 720px; min-width: 300px; width: 80%; margin: 0 auto; }
.service_detail_body .contents .description.oa figcaption { max-width: 800px; width: 98%; margin: 1em auto 2em auto; }
/*-- ご注文の流れ --*/
.service_detail_body .contents .description h4 span { margin: 2px 15px 0 10px; padding: 0 5px 0 10px; font-size: 20px; line-height: 30px; color: #00b097; background-color: #FFF; border-color: #FFF; border-style: solid; border-width: 1px 0 1px 1px; display: inline-block; vertical-align: text-top; position: relative; }
.service_detail_body .contents .description h4 span::after { content: ''; width: 0; height: 0; border-width: 16px 0 16px 15px; border-color: transparent transparent transparent #FFF; border-style: solid; display: block; overflow: hidden; position: absolute; top: -1px; right: -15px; }
.service_detail_body .contents .description.tool_flow ul { margin: 0 2%; display: flex; flex-wrap: wrap; }
.service_detail_body .contents .description.tool_flow li { margin: 0 0 15px -15px; }
.service_detail_body .contents .description.tool_flow li p { width: 204px; height: 74px;font-size: 22px; font-weight: 600; line-height: 24px; text-align: center; border-width: 1px 1px 1px 0; color: #FFF; background-color: #00b097; border-color: #FFF; border-style: solid; position: relative; }
.service_detail_body .contents .description.tool_flow li p::before, .service_detail_body .contents .description.tool_flow li p::after { content: ''; width: 0; height: 0; border-width: 36px 0 36px 15px; border-style: solid; display: block; position: absolute; top: 0; }
.service_detail_body .contents .description.tool_flow li p::before { border-color: #FFF transparent #FFF transparent; left: 0; }
.service_detail_body .contents .description.tool_flow li p::after { border-color: #00b097 transparent #00b097 transparent; left: 1px; }
.service_detail_body .contents .description.tool_flow li:first-child p { border-left-width: 1px; }
.service_detail_body .contents .description.tool_flow li:first-child p::before, .service_detail_body .contents .description.tool_flow li:first-child p::after { display: none; }
.service_detail_body .contents .description.tool_flow li span { font-size: 14px; font-weight: normal; line-height: 16px; display: block; }
.service_detail_body .contents .description.tool_flow li p span { text-align: center; }
.service_detail_body .contents .description.tool_flow li .flat { padding: 25px 0; }
.service_detail_body .contents .description.tool_flow li .stair { padding: 20px 0 14px 0; }
.service_detail_body .contents .description.tool_flow li .double { padding: 15px 0; font-size: 20px; line-height: 24px; }
.service_detail_body .contents .description.tool_flow li.annotation { margin: 0 0 0 20px; }
.service_detail_body .contents .description.tool_flow li.annotation span { padding: 20px 0 20px .8em; text-indent: -.8em; }
/*-- WEBサンプル用スライダー --*/
.service_slider01, .service_slider02, .service_slider03, .service_slider04 { width: 100%; margin: 1em auto 0 auto; }
.service_slider04 { min-width: 600px; margin: 0 auto; position: relative; left: 49.9%; transform: translateX(-50.1%); }
.service_slider01 li, .service_slider02 li, .service_slider03 li { margin: 0 .5%; }
.service_slider04 li { margin: 0 .1%; position: relative; }
.service_slider04 li::before { content: ""; padding-top: 100%; display: block; }
.service_slider04 li img { height: 100%; position: absolute; top: 0; object-fit: cover; }
.service_slider_tit { max-width: 1300px; min-width: 300px; width: 90%; margin: .5em auto; font-size: 1.5em; letter-spacing: .1em; color: #00b097; }
/*-- コンテンツ中罫線 --*/
.service_detail_body .contents i { width: 90%; max-width: 1300px; min-width: 300px; margin: 20px auto; border-top: 2px solid #00b097; display: block; }

/*------------------------------
  採用情報
------------------------------*/
/*-- 一覧 --*/
.recruit_wrap { padding-top: 0; }
.recruit_about{ padding-top: 3em; background-image: url(/common/img/bg_recruit04.png); background-position: left -50px top 100px; background-repeat: no-repeat; background-size: 210px; background-attachment: fixed; }
.recruit_about h2 { text-shadow: 0 1px 1px #FFF, 0 -1px 1px #FFF, 1px 0 1px #FFF, 1px 1px 1px #FFF, 1px -1px 1px #FFF, -1px 0 1px #FFF, -1px 1px 1px #FFF, -1px -1px 1px #FFF; }
.recruit_read { max-width: 680px; min-width: 320px; width: 90%; margin: 2em auto; }
.recruit_read img { margin: 0 auto 1em auto; border-radius: .5em; }
.recruit_read p { letter-spacing: .15em; line-height: 1.8em; }
.treatment { max-width: 980px; min-width: 300px; width: 90%; margin: 5em auto 0 auto; padding-bottom: 5em; font-size: .9em; color: #444; display: flex; flex-wrap: wrap; }
.treatment li { width: 29.33%; padding: .15em; margin: 0 2% 2.5em 2%; }
.treatment li img { width: 100%; }
.treatment li h4 { margin: .5em .1em .25em .25em; font-size: 1.25em; font-weight: 600; line-height: 1.2em; color: #00b097; }
.treatment li p { margin: 0 .1em 0 .25em; }
.recruit_body { background-image: url(/common/img/bg_recruit03.jpg); background-position: 100% 0; background-repeat: no-repeat; background-size: 100%; }
.recruit_body .btn a:hover { border: #FFF solid 2px; }
.recruit_body .note { max-width: 900px; min-width: 260px; width: 80%; margin: 2em auto; }
.recruit_list { max-width: 980px; min-width: 300px; width: 90%; margin: 0 auto; }
.recruit_list li { margin: 0 auto 1em auto; }
.recruit_list li a { font-weight: normal; color: #FFF; background-color: rgba(0,176,151,0.7); background-image: url(/common/img/ico/ico_down_green.svg); background-position: left 50% bottom .3em; background-repeat: no-repeat; background-size: .8em; border: #FFF solid 2px; border-radius: .5em; display: block; overflow: hidden; }
.recruit_list li dl { width: 100%; display: flex; flex-wrap: wrap; }
.recruit_list li:nth-child(even) dl { flex-direction: row-reverse; }
.recruit_list li dt { width: 65%; padding: 1em 3em 1em 1.5em; }
.recruit_list li dd { width: 35%; }
.recruit_list li a dd img { width: 100%; transition: .3s; }
.recruit_list li h4 { padding: 0 0 .5em 1.75em; width: 100%; font-size: 2em; font-weight: 600; background: url(/common/img/ico/ico_kaeru_w.svg) left 0 top 0 no-repeat; background-size: 1.5em; position: relative; transition: .3s; }
.recruit_list li h4::after { content: '- 募集要項 -'; width: 100%; padding: 0 1em; font-size: .3em; line-height: 1.5em; color: #FFF; border: #FFF solid 1px; position: absolute; left: 0; bottom: .25em; }
.recruit_list li p { margin: .15em 0; }
.recruit_list li .salary span { margin-left: 1em; font-size: 1.25em; font-weight: 600; font-family: Verdana, sans-serif; }
.recruit_list li .location span { margin-left: .25em; font-weight: 600; }
.recruit_list li .workstyle { margin-top: .5em; }
.recruit_list li .workstyle span { margin: 0 .25em 0 0; padding: .15em .5em; font-size: .8em; font-weight: 600; color: #00b097; background-color: #FFF; border-radius: .25em; transition: .3s; }
.recruit_list li a:hover { color: #00b097; background-color: #FFF; box-shadow: 0 1px 5px 0 rgba(0,0,0,0.3); }
.recruit_list li a:hover h4 { letter-spacing: .1em; background-image: url(/common/img/ico/ico_kaeru_green.svg) }
.recruit_list li a:hover h4::after { letter-spacing: 0; color: #00b097; border-color: #00b097; }
.recruit_list li a:hover .workstyle span { margin-left: .25em; color: #FFF; background-color: #00b097; }
.recruit_list li a:hover dd img { opacity: 0.6; transform: scale(1.015); transition: 0s; }
/*-- 詳細 --*/
.recruit_detail_body { margin-top: -80px; padding-top: 80px; margin-bottom: 5em; }
.recruit_detail_a { padding: 0 0 1em 0; position: relative; }
.recruit_detail_select { display: flex; position: absolute; top: 0; right: 5%; z-index: 10; }
.recruit_detail_select .btn_recruit_select { margin-left: .5em; }
.recruit_detail_select .btn_recruit_select a, .recruit_detail_select .btn_recruit_select span { width: 8em; height: 3em; font-weight: 600; line-height: 3em; text-align: center; border-color: #FFF; border-style: solid; border-width: 0 2px 2px 2px; border-radius: 0 0 .5em .5em; display: block; transition: .3s ease-out; }
.recruit_detail_select .btn_recruit_select span { color: #6DA; background-color: #FFF; }
.recruit_detail_select .btn_recruit_select a { color: #FFF; background-color: #00b097; }
.recruit_detail_select .btn_recruit_select a:hover { height: 3.5em; line-height: 3.5em; color: #00b097; background-color: #FFF; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.3); }
.recruit_detail_title { max-width: 1200px; min-width: 320px; width: 94%; padding: 2em 0 0 5.5em; margin: 0 auto; position: relative; }
.recruit_detail_title .btn_back { width: 5em; height: 4em; position: absolute; left: 0; bottom: .5em; }
.recruit_detail_title .btn_back a { padding-left: .5em; line-height: 4em; text-align: center; background-image: url(/common/img/ico/ico_arl_white.svg); background-position: left .15em top 48%; background-repeat: no-repeat; background-size: .6em; border: #FFF solid 2px; border-radius: .5em; display: block; }
.recruit_detail_title .btn_back a:hover { color: #00b097; background-color: #FFF; background-image: url(/common/img/ico/ico_arl_green.svg); }
.recruit_detail_title h2 { padding: 0 0 .15em .5em; font-size: 2.4em; font-weight: 600; letter-spacing: .1em; line-height: 1em; color: #FFF; border-bottom: #FFF solid 3px; }
.recruit_detail_title h2 span { padding-left: 1.5em; font-size: .4em; letter-spacing: 0; line-height: 2em; color: #FD6; background: url(/common/img/ico/ico_resume_yellow.svg) 0 50% no-repeat; background-size: 1.25em; display: block; }
.recruit_detail_title .capacity { margin: .5em 1em 0 0; font-size: .8em; font-weight: 600; line-height: 1.5em; text-align: right; }
.recruit_detail_title .capacity span { padding: 0 .5em; margin-right: .75em; font-weight: normal; color: #00b097; background-color: #FFF; border-radius: .3em; display: inline-block; }
.recruit_detail_a .badge { max-width: 1200px; min-width: 320px; width: 100%; margin: 0 auto; padding-left: 6em; display: flex; flex-wrap: wrap; }
.recruit_detail_a .badge li { margin: .25em .5em; padding: .25em 1em .25em 2.5em; font-weight: 600; color: #CFD; background: url(/common/img/ico/ico_kaeru_lightgreen.svg) left .5em top 50% no-repeat; background-size: 1.5em; border: #CFD dotted 1px; border-radius: .35em; }
.recruit_detail_rules { max-width: 980px; min-width: 300px; width: 86%; margin: 2em auto 0 auto; }
.recruit_detail_rules h3 { font-size: 1em; letter-spacing: .2em; line-height: 2em; text-align: center; color: #FFF; background-color: #00b097; border-radius: .5em .5em 0 0; }
.recruit_detail_rules>ul>li { width: 100%; border-color: #00b097; border-style: solid; border-width: 0 1px; }
.recruit_detail_rules>ul>li:last-child { border-bottom-width: 1px; border-radius: 0 0 .625em .625em; overflow: hidden; }
.recruit_detail_rules dl { display: flex; align-items: stretch; }
.recruit_detail_rules dt { width: 8em; font-weight: 600; line-height: 4em; text-align: center; color: #FFF; background-color: #00b097; border-top: #FFF solid 1px; }
.recruit_detail_rules dd { width: calc(100% - 8em); padding: 1em 1em 1em 1.5em; border-top: #00b097 solid 1px; }
.recruit_detail_rules dd p { margin: 0 auto .5em auto; }
.recruit_detail_rules dd ul { display: flex; flex-wrap: wrap; }
.recruit_detail_rules dd li { margin: 0 .25em .25em 0; padding: .25em 1em; font-size: .9em; font-weight: 600; color: #00b097; border: #00b097 dotted 1px; border-radius: .3em; }
.recruit_detail_rules dd li span { font-size: .9em; font-weight: normal; line-height: 1.5em; color: #666; }
.recruit_detail_rules .job .list { display: flex; flex-wrap: wrap; }
.recruit_detail_rules .job .list i { margin: .25em 1em; font-style: normal; }
.recruit_detail_rules .required { margin: 0 auto; font-size: 1.1em; font-weight: 600; }
.recruit_detail_rules .required span { padding: .125em .5em; margin-right: .5em; font-size: .8em; color: #FFF; background-color: #666; border-radius: .3em; }
.recruit_detail_rules .payroll { margin: 0 auto; font-size: 1.1em; font-weight: 600; }
.recruit_detail_rules .payroll span { margin: 0 .2em; font-size: 1.1em; font-family: Verdana, sans-serif; line-height: 1em; }
.recruit_detail_rules .description { margin: 0 auto 1em auto; font-size: .8em; line-height: 1.25em; color: #666; }
.recruit_detail_rules .address span { font-size: 1.1em; font-weight: 600; display: block; }
.recruit_detail_rules .worktime, .recruit_detail_rules .holiday { font-size: 1.1em; font-weight: 600; line-height: 1em; }
.recruit_detail_rules .indent { margin-left: 1em; }
.recruit_entry { max-width: 1080px; min-width: 310px; width: 94%; padding: 1em 5%; margin: 1em auto; background-color: #CFD; border-radius: .3em .8em 2em .3em; }
.recruit_entry h3 { width: 8em; margin: 0 auto 1em auto; font-size: 1.25em; font-weight: 600; letter-spacing: .25em; line-height: 2em; text-align: center; color: #FFF; background-color: #00b097; border-radius: 1em; position: relative; }
.recruit_entry h3::before, .recruit_entry h3::after { content: '　'; width: 1em; height: 1em; background-color: #00b097; border-radius: .5em; display: block; position: absolute; top: .5em; }
.recruit_entry h3::before { left: -1.3em; }
.recruit_entry h3::after { right: -1.3em; }
.recruit_entry p a { margin: 0 .25em; font-weight: 600; color: #00b097; border-bottom: #00b097 solid 1px; display: inline-block; }
.recruit_entry p a:hover { color: #FD6; border-bottom-color: #FD6; animation: pyon .3s ease-out 1; }
.recruit_entry ul { display: flex; flex-wrap: wrap; }
.recruit_entry ul:has(li:only-child) { justify-content: center; }
.recruit_entry li { width: 48%; margin: 1em 1%; }
.recruit_entry li dt { padding-left: 2.5em; font-weight: 600; line-height: 2em; color: #00b097; background: url(/common/img/bg_recruit_label_stamp_green_r.svg) left .5em top 30% no-repeat; background-size: 1.5em; }
.recruit_entry .btn_recruit a { padding: 1em 1em 1em 0; text-align: center; font-size: 1.25em; font-weight: 600; line-height: 1.2em; color: #00b097; background-color: #FFF; background-image: url(/common/img/ico/ico_next_green.svg); background-position: right .5em top 50%; background-repeat: no-repeat; background-size: .8em; border: #00b097 solid 3px; border-radius: .5em; display: block; }
.recruit_entry .btn_recruit a:hover { background-color: #FD6; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }



/*------------------------------
  お客様ログイン
------------------------------*/
/*-- ログイン --*/
.login_wrap { padding-top: 2em; }
.login_body { padding-bottom: 2em; }
.login_body .result { font-size: 1.25em; font-weight: 600; text-align: center; }
.login_body dl { margin: 2em auto; color: #444; position: relative; z-index: 3; }
.login_body dt { font-size: .88em; letter-spacing: .15em; text-align: center; }
.login_body dd { max-width: 500px; min-width: 13em; width: 80%; margin: .25em auto; padding: 0 1em 0 2em; font-size: 1.8em; font-weight: 600; background-position: 0 50%; background-repeat: no-repeat; background-size: 1.5em; }
.login_body .user dd { background-image: url(/common/img/ico/ico_mail_green.svg); }
.login_body .passwd dd { background-image: url(/common/img/ico/ico_key_green.svg); }
.login_body dd input { width: 100%; padding: .25em .5em; font-size: 1em; font-weight: 600; line-height: 1em; color: #00b097; background-color: #f9f9f9; border-color: #888; border-width: 1px; border-style: solid; border-radius: .15em; outline: none; appearance: none; -webkit-appearance: none; }
.login_body dd input:focus { background-color: #FFF; border-color: #00b097; box-shadow: 0 0 .25em 0 rgba(0,176,151,0.5); }
.login_body .btn_login { width: 13em; margin: 3em auto; font-size: 1.33em; position: relative; z-index: 2; }
.login_body .btn_login::after { content: ''; width: 153px; height: 189px; background: url(/common/img/bg_customer_login01.png) 0 0 no-repeat; background-size: 100%; position: absolute; top: -60px; right: -110px; z-index: -1; }
.login_body .btn_login input[type="submit"] { width: 13em; padding: 1em 0; font-size: 1em; font-weight: 600; letter-spacing: .25em; line-height: 1em; text-align: center; color: #FFF; background-color: #00b097; border: #00b097 solid 2px; border-radius: .25em; outline: none; display: block; cursor: pointer; appearance: none; -webkit-appearance: none; }
.login_body .btn_login input[type="submit"]:hover { color: #00b097; background-color: #FFF; box-shadow: 0 1px 5px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }
/*-- 資料ダウンロード --*/
.document_read { max-width: 980px; min-width: 320px; margin: 0 auto; padding: 1em 0 0 200px; background: url(/common/img/bg_customer01.png) left 10px bottom 0 no-repeat; background-size: 180px; }
.document_read .company { margin-bottom: 0; font-size: 1.25em; font-weight: 600; line-height: 1.2em; }
.document_read .company span { margin-left: .25em; font-size: .8em; }
.document_body .sub_topic div { padding: .5em 2em; border: #00b097 solid 1px; }
.document_body .sub_topic div p { margin: .75em 0; }
/*-- ログアウトボタン --*/
.btn_logout { max-width: 300px; min-width: 240px; width: 50%; margin: 0 auto; }
.btn_logout input { width: 100%; padding: 1em 0 1em 1.5em; font-size: 1.25em; font-weight: 600; text-align: center; color: #FFF; background-color: #00b097; background-image: url(/common/img/ico/ico_logout_w.svg); background-position: left 28% top 45%; background-repeat: no-repeat; background-size: 1.5em; border: #00b097 solid 2px; outline: none; display: block; appearance: none; -webkit-appearance: none; }
.btn_logout input:hover { color: #00b097; background-color: #FFF; background-image: url(/common/img/ico/ico_logout_green.svg); box-shadow: 0 1px 5px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }


/*------------------------------
  サイトマップ
------------------------------*/
.sitemap_wrap { background: url(/common/img/bg_service01.png) 0 0 no-repeat; background-size: 29.68vw; }
.sitemap { max-width: 980px; min-width: 300px; width: 96%; margin: 0 auto; }
.sitemap .read { padding: 1em 2em; margin: 2em auto; text-indent: 1em; color: #444; background-color: #e4f9bd; border-radius: .5em; }
.sitemap dl { width: 100%; margin: 4em auto; }
.sitemap dt { border-bottom: #00b097 solid 3px; display: flex; }
.sitemap dt h3 { padding: 0 .5em 0 1.75em; margin: 0 .5em 2px 0; font-size: 1.8em; font-weight: 600; letter-spacing: .125em; line-height: 1.25em; background: url(/common/img/ico/ico_kaeru_green.svg) 0 0 no-repeat; background-size: 1.5em; border-right: #00b097 solid 2px; }
.sitemap dt span { padding-top: .5em; line-height: 1.25em; }
.sitemap dd ul { display: flex; flex-wrap: wrap; }
.sitemap dd ul li { width: 49%; margin: .75em 2% 0 0; }
.sitemap dd ul li:nth-child(even) { margin-right: 0; }
.sitemap dd a { height: 100%; padding: .5em 2.5em .5em 1.5em; font-size: 1.25em; font-weight: 600; background-color: #FFF; background-image: url(/common/img/ico/ico_next_green.svg); background-position: right .5em top 50%; background-repeat: no-repeat; background-size: .75em; border: #00b097 solid 2px; border-radius: .25em; display: block; }
.sitemap dd a:hover { color: #00b097; background-color: #e4f9bd; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3); animation: pyon .3s ease-out 1; }
.sitemap dd a.main { color: #FFF; background-color: #00b097; background-image: url(/common/img/ico/ico_next_white.svg); }
.sitemap dd a.main:hover { color: #00b097; background-color: #e4f9bd; background-image: url(/common/img/ico/ico_next_green.svg); }
.sitemap dd a.home { width: 25em; padding: 0 2.5em 0 1.5em; margin: 0 auto; }
.sitemap dd a.home span { padding: .8em 0 .8em 2.25em; background-image: url(/common/img/ico/ico_home_white.svg); background-position: 0 50%; background-repeat: no-repeat; background-size: 2em; display: block; }
.sitemap dd a.home:hover span { background-image: url(/common/img/ico/ico_home_green.svg); }


/*------------------------------
  404 NOT FOUND
------------------------------*/
.notfound_wrap h2 { padding: .5em 0; font-size: 3.25em; font-weight: 600; font-family: Helvetica, Arial, sans-serif; line-height: 1em; text-align: center; }
.notfound_body { border-bottom-left-radius: 40% 3em; }
.notfound_wrap h2 span { margin-bottom: -.1em; font-size: 3em; line-height: 1em; text-align: center; display: block; }
.notfound_wrap p, .notfound_wrap dt, .notfound_wrap dd { text-align: center; }
.notfound_wrap dl { margin-bottom: 4em; }
.notfound_wrap .big { font-size: 2.1em; font-weight: 600; line-height: 1.2em; }
.notfound_wrap .note { max-width: 800px; width: 80%; padding: 1em 0; margin: 1em auto; border-color: #FFF; border-style: solid; border-width: 2px 0 2px 0; }




/*------------------------------
  MediaQuery
------------------------------*/
/*-- iPad pro --*/
@media screen and (min-width:1024px) and (max-width:1280px){
  /*ヘッダー*/
  .headmenu .submenu.wide li { width: 45%; }
  .headmenu .submenu.wide li a { padding: 0 10%; }
  header .tab_contact a { width: 250px; height: 220px; top: calc(50% - 110px); font-size: .9em; }
  header .tab_contact .tab { width: 50px; padding: 60px 14px 0 20px; background-position: top 20px left 50%; background-size: 35px; }
}


/*-- iPad：portrait --*/
@media screen and (min-width:600px) and (max-width:1023px){
  /*common*/
  html { scroll-padding-top: 5em; }
  body { font-size: 9px; }
  .bgg, .bgw { padding-top: 60px; }
  .btn_more { max-width: 320px; }
  .btn_home, .btn_contact { max-width: 460px; }
  .btn_home a, .btn_contact a { font-size: 1.1em; }
  .kaeru_bread { padding-top: 60px; }
  .kaeru_bread li.home { margin-left: 2%; }
  .kaeru_bread li span { font-size: .6em; }
  h3.tit_mini { font-size: 1.125em; letter-spacing: .1em; }
  .list_title>p  { font-size: 3em; }
  .list_title .bar { padding: .5em .5% 0 3%; margin-top: -.8em; }
  .list_title .bar h2 { font-size: 1.3em; }
  .list_title.detail .bar .btn_back a { width: 5.75em; padding: 0 .75em 0 2em; margin-right: .5em; background-position: left .75em top 45%; background-size: 1em; border-right-width: 1px; }
  .sub_topic { padding-top: 60px; }
  .sub_topic h3 { padding: .5em 2em; font-size: 1.15em; }
  .sub_topic h3::before { left: .25em; }
  .pager_detail .back a { font-size: 1em; }
  .contact_inline h3.tit { padding-bottom: .25em; }
  .contact_inline h3.tit::before { width: 150px; height: 73px; right: -3em; }
  .contact_inline p { font-size: 1.25em; }
  .btn_contact_inline a { width: 90%; }
  .contact_inline li a { font-size: 1em; }
  .dl_files>div>p, .dl_files .files { width: 90%; }
  .dl_files .files dt { padding-left: 4.2em; background-size: 3.5em; }
  .dl_files .files h4 { font-size: 1.25em; }
  .dl_files .files .size { font-size: .875em; }
  .dl_files .files .dl, .dl_files .files .dl_out { font-size: 1em; }
  /*ヘッダー*/
  header { height: 60px; }
  header h1 { padding-left: 9em; font-size: .555em; background-position: left 7em top 0; }
  .header_wrap { width: 100%; height: 60px; margin-top: -1.15em; }
  .headlogo { width: 200px; margin-left: .5em; padding-top: 1em; }
  header .headmenu { width: calc(100% - 200px); height: 100%; margin-left: 1%; font-size: .9em; }
  .headmenu a { line-height: 75px; }
  .headmenu .submenu, .headmenu .submenu.wide { display: none; }
  .headmenu .submenu li { width: 200%; }
  .headmenu .submenu li a { padding: 0 .5em 0 1em; }
  header .tab_contact a { width: 250px; height: 220px; top: calc(50% - 110px); }
  header .tab_contact .tab { width: 50px; padding: 60px 14px 0 20px; background-position: top 20px left 50%; background-size: 35px; }
  /*フッター*/
  .footer_info dt { min-width: 30vw; width: 30vw; }
  .footer_info dt a { padding: 1.5em 2vw 1.5em 3vw; }
  .footer_info dt a img { min-width: 120px; }
  .footer_info dd { padding-left: .5em; }
  .footer_info h4 { font-size: 1.2em; line-height: 1.6em; }
  .footer_info .office li { font-size: .9em; min-width: 100%; }
  .footer_info .office li .name { width: 9.5em; }
  .footmenu { width: 96%; margin: 1em 1% 1em 3%; }
  .footmenu li a { font-size: 1.6em; line-height: 3em; }
  /*-- TOPページ --*/
  .top_wrap h2 { font-size: 2em; }
  .top_wrap h2 span { font-size: .5em; }
  #top_cover { height: 72vw; padding-top: 40vw; }
  #top_cover i.hero { width: 105%; margin: 0 auto; }
  #top_cover .newsticker { width: 96%; margin: 0 4% 0 0; }
  .cover_slider { margin-top: 1.5em; }
  .cover_slider li { width: 24vw; margin: .5em .5vw; }
  .cover_slider li dd { padding: .125em .25em .25em .5em; font-size: .8em; }
  .top_wrap .contact_inline h3.tit { width: 60%; padding: 0 0 6em 0; }
  #top_about .about_body { width: 70%; padding-top: 39vw; }
  #top_news { background-size: 24vw, 15px; }
  #top_news h2 { margin-top: -1.7em; padding-top: 1.7em; background-size: 400px; }
  .top_news_list li { width: 49%; }
  .top_news_list li:nth-child(odd) { margin-right: 2%; }
  .top_news_list a dt { width: 35%; }
  .top_news_list a dt { width: 63.4%; }
  .top_news_list a .category { font-size: .8em; }
  .top_news_list a .title { font-size: 1.1em; }
  .top_service_list { width: 90%; margin-top: 2em; }
  #top_service { background-size: 420px; }
  #top_service .btn_more { margin: 30px auto; }
  #top_service .btn_more::before { display: none; }
  #top_works h2 { padding-top: 40px; background-size: 120px; }
  .top_works_list a dd { font-size: 1em; }
  #flow .read  { width: 60%; }

  /*-- お知らせ一覧 --*/
  .info_wrap { width: 94%; }
  .list_title.info>p { padding-right: 400px; background-size: 400px; }
  .list_title.info .listmenu dt { width: 5.25em; padding-right: .85em; line-height: 1em; background-position: right .25em top 40%; }
  .list_title.info .listmenu dd a, .list_title.info .listmenu dd span { width: 5em; min-height: 3em; font-size: .75em; }
  .newslist li .update { font-size: .75em; }
  .newslist.large { margin: 1.5em auto 1em auto; }
  .newslist.small li a { width: 94%; }
  .newslist.small li .update { width: 8em; letter-spacing: 0; }
  .newslist.small li .category { text-align: center; display: block; }
  .newslist.small li dd { width: calc(100% - 8em); }
  /*-- お知らせ詳細 --*/
  .list_title.detail.info .bar h2 { font-size: 2em; }
  .list_title.detail.info .bar .btn_back a { height: 3.5em; line-height: 3.5em; }
  .info_body a { text-decoration: underline; }
  /*-- 制作事例一覧 --*/
  .works_wrap { width: 94%; }
  .list_title.works>p { padding-right: 200px; background-size: 200px; }
  .list_title.works h2 { font-size: 1.125em; letter-spacing: .1em; }
  .list_title.works .listmenu dt { padding-right: 1.25em; line-height: 1em; background-position: right .25em top 40%; }
  .list_title.works .listmenu dd a, .list_title.works .listmenu dd span { width: 10em; font-size: .75em; line-height: 2em; }
  .submenu.works li { margin-right: .25em; }
  .submenu.works a, .submenu.works span { font-size: .888em; }
  .workslist li .read { margin-top: .5em; -webkit-line-clamp: 4; line-clamp: 4; }
  .workslist.large { width: 100%; margin: 1.5em auto 0 auto; }
  .workslist.large li dt { width: 50%; height: 100%; }
  .workslist.large li dt img { height: 100%; object-fit: cover; }
  .workslist.large li dd { width: 49%; margin: 0 0 0 1%; }
  .workslist.large li .title { font-size: 1.25em; line-height: 1.3em; }
  .workslist.small { margin: 1.5em auto 0 auto; }
  .workslist.medium { width: 100%; }
  .workslist .listbody>dl>dt { margin: 0; }
  .workslist .listbody>dl>dd { padding: 0 0 0 .5em; font-size: .8em; }
  .workslist .listbody h3 a .title { margin-bottom: .25em; font-size: 1.75em; }
  .workslist .listbody .info dd li { margin-bottom: .125em; }
  .workslist .listbody .company { line-height: 1em; }
  .workslist .listbody a.anchor { padding: .75em .5em; margin-top: .125em; }
  /*-- 制作事例詳細 --*/
  .list_title.detail.works .bar h2 { font-size: 1.5em; line-height: 1.15em; }
  .list_title.detail.works .bar .btn_back a { height: 3em; line-height: 3em; }
  .slide-arrow { width: 30px; height: 53px; padding: 16px 9px; }
  .slide-dots li button { width: .75em; height: .75em; }
  .works_detail { width: 96%; margin: .75em auto; }
  .works_detail h3 { font-size: 2.3em; }
  .works_detail .description dl { margin: 0 1% .25em 0; }
  .works_detail .description dl.work { max-width: 60%; width: auto; }
  .works_detail .description dl.property { min-width: auto; max-width: 38%; width: auto; margin-right: 0; }
  .works_body a { text-decoration: underline; }
  .other_works ul li { width: 225px; margin: 0 20px 0 0; }
  .other_works a dt img { width: 100%; height: 150px; }
  /*-- お問合せ --*/
  .contact_wrap { padding-top: 0; }
  .contact_wrap h2 { padding-top: 1.5em; background-size: 6em; }
  .contact_wrap h2.send { background-size: 4em; }
  .contac_read, .contact_confirm, .contact_confirm, .lnk_partner a { max-width: 43em; font-size: .75em; }
  .contac_read { margin: 2em auto 1em auto; }
  .contact_send { margin: 3em auto; }
  .contact_body .control .chkbox { width: 25em; font-size: .875em; }
  .contact_body .control input[type="submit"] { font-size: 1.25em; letter-spacing: 0; }
  .contact_body .control.duo input[type="submit"] { max-width: 250px; width: 46%; margin: .5em 1%; }
  /*-- 協力会社募集中 --*/
  .partner_wrap { padding-top: 0; }
  .partner_wrap h2 { max-width: 450px; width: 75%; height: 100px; padding: 30px 100px 0 100px; background-size: 100px; }
  /*-- 事業部門のご紹介 --*/
  .division_wrap { padding-top: 0; }
  h2.tit.business span { margin-top: .5em; }
  .business_read { margin: 2em auto 1em; padding-top: 33vw; letter-spacing: 0; line-height: 1.8em; background-size: 80%; }
  .btn_division { width: 90%; }
  .btn_division dd { font-size: .725em;}
  .story .comic { width: 94%; margin: 2em auto; }
  .story .comic li { margin-bottom: 1em; padding: 3px; border: #FFF solid 2px; }
  .story .comic li::after { font-size: 1.25em; }
  .division_card { padding-top: 0; }
  .division_card#planning { margin-bottom: 60px; }
  .bn_division { line-height: 5em; }
  .bn_division::before { height: 2.5px; position: absolute; left: 0; bottom: 19.5px; }
  .bn_division img { width: 520px; margin-left: auto; position: relative; z-index: 10; }
  .division_card dt { width: 30%; }
  .division_card dd { width: 68%; }
  .division_card dd p.division_text { font-size: .875em; }
  .division_card dd .service { margin: 1em auto 0 auto; }
  .division_card dd .service li a { margin: 0 .25em .25em 0; padding: .1em .5em; letter-spacing: 0; }
  /*-- 事業部門詳細 --*/
  article.division_detail_wrap { padding-top: 30px; }
  .division_d_head { margin: 3em 0 6em; }
  .division_d_head dt p { height: 40vw; max-height: 360px; min-height: 240px; }
  .division_service li dl { padding: 3em 1%; display: block; }
  .division_service li dt { width: calc(94% - 103.68px ); max-width: 523px; margin: 0 auto; }
  .division_service li dd { width: 96%; max-width: 640px; margin: 1em auto 0; }
  .division_service li dd .sentence { margin: 1em 0 3em; }
  /*-- 企業情報 --*/
  .ceo_wrap { margin-bottom: 180px; padding: 0; }
  .ceo_body { min-width: 600px; width: 100%; height: 560px; background-size: 400px; }
  .ceo_body .ceo_title { width: 200px; }
  .ceo_body .ceo_voice { margin: 2em auto 1em auto; padding-left: 1%; font-size: 2em; }
  .ceo_body .ceo_read { width: 69%; max-width: 30em; min-height: 195px; margin: 0 auto 1em 2%; }
  .ceo_body .ceo_read span { line-height: 2em; }
  .ceo_body .btn_division2 { width: 100%; margin: 70px 0; padding: 20px calc(20% - 80px) 10px; background-color: #00b097; }
  .ceo_body .btn_division2 li { margin-bottom: 1%; }
  .ceo_body .btn_division2 li dt a { white-space: nowrap; }
  .ceo_body .btn_division2 dd { font-size: .7em; }
  .ceo_body .name { right: 1em; }
  .philosophy_tile { width: 96%; margin: 2em auto 0 auto; }
  .philosophy_tile li  { height: 20em; }
  .philosophy_tile li:nth-child(even) { margin-right: 0; }
  .philosophy_tile h4 { font-size: 2em; }
  .philosophy_tile li p { font-size: 1em; }
  .philosophy_tile li.way { background-size: 45%; }
  .philosophy_tile li.mission p { margin: 5em auto 0 auto; }
  .philosophy_tile li.vision p { margin: 3em auto 0 auto; }
  .philosophy_tile li.value p { margin: 2em auto 0 auto; }
  .philosophy_tile li.way p {  width: 12em; margin: 0 0 0 auto;}
  .profile_list { width: 90%; margin: 1em auto 3em auto; }
  .profile_list dt { width: 10em; font-size: .8em; }
  .profile_list dd { width: calc(100% - 8em); }
  .profile_list dt p, .profile_list dd p { padding: 1em .5em; }
  .profile_list dd p .zip { font-size: .8em; }
  .profile_list .icons li { max-width: 7em; }
  .profile_list .icons li img { height: 4em; }
  .profile_list .icons li.usen img { width: 7em; }
  .profile_list .icons li p { font-size: .6em; }
  .profile_list .map_add { align-items: flex-end; }
  .profile_list .map_add>div { width: calc(100% - 12em); }
  .profile_list .map_add a.map_large { width: 12em; }
  .history { background-size: 15px, 160px; }
  .history_list dt { width: 6em; padding: 1em .5em; }
  .history_list dd { width: calc(100% - 6em); padding: 1em .5em; }
  /*-- 組織図・グループ企業 --*/
  .company_chart::after { width: 24vw; height: 15.33vw; right: -5vw; top: -7.8vw; }
  .group_wrap { background-size: 14vw; }
  .group_list { width: 90%; }
  .group_list li { padding: 1em; }
  .group_list li dt { width: 25%; }
  .group_list li dd { width: 75%; font-size: .8em; }
  .group_list li dd .link a { line-height: 2.6em; }
  /*-- サービスメニュー --*/
  .service_wrap { padding: 2em 0; background-size: 200px; }
  .service_wrap h2.tit { width: 530px; padding: 0 0 1em 0; background-size: 180px;  }
  .service_list { width: 90%; margin: 2em auto 3em auto; }
  .service_list dt { font-size: .8em; }
  /*-- サービス詳細 --*/
  .service_detail_wrap { padding: 0 0 2em 0; }
  .list_title.service>p { padding: .75em 300px 0 0; background-size: 300px; }
  .list_title.detail.service .bar h2 { font-size: 1.5em; line-height: 1.15em; }
  .list_title.detail.service .bar .btn_back a { height: 3em; line-height: 3em; }
  .service_detail_body { margin: 1.5em auto; }
  .service_detail_body .service_head dt { width: 30%; }
  .service_detail_body .service_head .left_head dt { margin: 0 1em .5em 0; }
  .service_detail_body .service_head .right_head dt { margin: 0 0 .5em 1em; }
  .service_detail_body .service_head dd { padding: 0; letter-spacing: 0; line-height: 1.5em; }
  .service_detail_body .service_head dd.suggest h4 { font-size: 1.75em; }
  .service_detail_body .service_foot { margin-top: 3em; }
  .service_detail_body .contents .deco_catch { font-size: 3em; }
  .service_detail_body .contents .deco_catch span.small { font-size: .38em; }
  .service_detail_body .contents .program { padding-top: 60px; }
  .service_detail_body .contents .program.consultant { padding: 40px 0 20px; }
  .service_detail_body .contents .program.estate { padding: 20px 0; }
  .service_detail_body .contents .program.estate:last-child { padding: 20px 0 0; }
  .service_detail_body .contents .program.lr .text { width: 65%; }
  .service_detail_body .contents .program.lr figure { width: 35%; }
  .service_detail_body .contents .program h3 { font-size: 1.75em; }
  .service_detail_body .contents .program h3 span.round { padding: 0 1em 0 .5em; }
  .service_detail_body .contents .program .copy { font-size: 1.125em; }
  .service_detail_body .contents .program p { height: calc(100% - 3.15em); padding: .5em 1em; letter-spacing: 0; line-height: 1.5em; }
  .service_detail_body .contents .program.consultant p { min-height: 202px; padding: .5em 260px 1em .5em; background-size: 300px auto; }
  .service_detail_body .contents .program.estate p.add_catch { margin: 2em 0 0; font-size: 1.125em; }
  .service_detail_body .contents .program .detail.d2 li, .service_detail_body .contents .program .detail.d3 li { width: 48%; margin-top: 1.2em; }
  .service_detail_body .contents .program .detail.d3 li:nth-child(3n+3) { margin-right: 2%; }
  .service_detail_body .contents .program .detail.d2 li:nth-child(even), .service_detail_body .contents .program .detail.d3 li:nth-child(even) { margin-right: 0; }
  .service_detail_body .contents .program.consultant .link_list { margin: 0 auto 0; }
  .service_detail_body .contents .program.estate .support_list:not(.three_point) li { width: 47%; margin: 2.5% 1.5%; border: 1px solid #00b097; }
  .service_detail_body .contents .program.estate .support_list.three_point dt figure::before { width: 6em; height: 6em; top: -3em; left: -3em; }
.service_detail_body .contents .program.estate .support_list.three_point dt figure::after { font-size: 1.25em; top: .35em; left: .35em; }
  .service_detail_body .contents .program.estate .support_list.three_point dd.support_text h4 { font-size: 1.25em; }
  .service_detail_body .contents .achievement h4 { font-size: 1.75em; }
  .service_detail_body .contents .achievement dl:first-child { margin-right: 3em; }
  .service_detail_body .contents .description { padding: .75em 2%; }
  .service_detail_body .contents .description h4 { font-size: 1.125em; }
  .service_detail_body .contents .description figcaption { font-size: .888em; }
  .service_detail_body .contents .description h4 span { margin: 2px 12px 0 8px; padding: 0 3px 0 8px; font-size: 16px; line-height: 20px; }
  .service_detail_body .contents .description h4 span::after { border-width: 11px 0 11px 12px; right: -12px; }
  .service_detail_body .contents .description.tool_flow li { margin: 0 0 12px -12px; }
  .service_detail_body .contents .description.tool_flow li p { width: 166px; height: 60px;font-size: 20px; line-height: 20px; }
  .service_detail_body .contents .description.tool_flow li p::before, .service_detail_body .contents .description.tool_flow li p::after { border-width: 29px 0 29px 12px; }
  .service_detail_body .contents .description.tool_flow li span { font-size: 13px; line-height: 15px; }
  .service_detail_body .contents .description.tool_flow li .flat { padding: 20px 0; }
  .service_detail_body .contents .description.tool_flow li .stair { padding: 13px 0 12px 0; }
  .service_detail_body .contents .description.tool_flow li .double { padding: 10px 0; font-size: 18px; line-height: 20px; }
  .service_detail_body .contents .description.tool_flow li.annotation span { padding: 15px 0 15px .8em; }
  /*-- 採用一覧 --*/
  .recruit_wrap { padding-top : 0; }
  .recruit_about { background-position: left -25px top 80px; background-size: 105px; }
  .recruit_read p { margin: 0 3%; }
  .treatment li { width: 46%; padding: .15em; margin: 0 2% 2.5em 2%; }
  .recruit_body { background-image: url(/common/img/bg_recruit02.jpg); background-size: 640px; }
  /*-- 採用詳細 --*/
  .recruit_detail_body { margin-top: -60px; padding-top: 60px; }
  .recruit_detail_a { padding-top: 2em; }
  .recruit_detail_select { right: 8%; }
  .recruit_detail_title { width: 96%; padding: 0 0 0 5.5em; }
  .recruit_detail_title .capacity { margin: .5em 3.5em 0 0; }
  .recruit_detail_content { width: 88%; }
  .recruit_detail_content dl { align-items: center; }
  .recruit_detail_content dt { width: 240px; }
  .recruit_detail_content dd { width: calc(100% - 240px); padding: 0 1em 0 7%; }
  .recruit_detail_content h3 { margin: 1.25em 0 0 7%; font-size: .8em; line-height: 1.8em; }
  .recruit_detail_content .badge { padding-left: 5%; }
  .recruit_detail_rules h3 { font-size: .8em; }
  .recruit_detail_rules { margin: 1.5em auto 0 auto; }
  .recruit_entry { width: 100%; padding-top: 1.5em; border-radius: 0 0 0 0; }
  /*-- お客様ログイン --*/
  .login_body .btn_login::after { width: 102px; height: 126px; top: -55px; right: -80px; }
  .document_read { padding-left: 150px; background-position: left 30px bottom 0; background-size: 150px; }
  .document_body .sub_topic { width: 90%; }
  .document_body .sub_topic div { padding: 0em 1.5em; }
  /*-- サイトマップ --*/
  .sitemap .read { font-size: .8em; }
  .sitemap dl { margin: 2.5em auto; }
  .sitemap dt { border-bottom-width: 2px; }
  .sitemap dt h3 { font-size: 1.25em; letter-spacing: 0; border-right-width: 1px; }
  .sitemap dt span { font-size: .8em; }
  .sitemap dd ul li { margin-top: .5em; }
  .sitemap dd a { font-size: 1em; }
}


/*-- iPhone --*/
@media screen and (max-width:599px){
  /*common*/
  html { scroll-padding-top: 5em; }
  body { font-size: 8px; }
  .bgg, .bgw { padding-top: 60px; }
  .btn_more { max-width: 260px; width: 68%; margin: 1em auto; }
  .btn_contact { margin: 2em auto 4em auto; }
  .btn_more a { font-size: 1em; }
  .btn_home a, .btn_contact a { padding: 1em; line-height: 1em; }
  .btn_pagetop { right: 2px; }
  .kaeru_bread { padding-top: 60px; }
  .kaeru_bread li.home { margin-left: 1%; }
  .kaeru_bread li span { font-size: .6em; }
  h3.tit_mini { font-size: 1.125em; letter-spacing: 0; }
  .list_title>p  { font-size: 3em; }
  .list_title .bar { padding: .5em 0 0 1%; margin-top: -.8em; display: block; }
  .list_title .bar h2 { font-size: 1.3em; display: block; }
  .list_title .listmenu { display: block; float: right; }
  .list_title .listmenu dt { width: 5.25em; padding-right: .85em; line-height: 1em; background-position: right .25em top 40%; }
  .sub_topic { padding-top: 45px; }
  .sub_topic h3 { padding: .5em 2em; }
  .sub_topic h3::before { left: .25em; }
  .pager { width: 96%; margin: 1.5em auto 3em auto; }
  .pager ul { flex-wrap: wrap; }
  .pager li { margin: 0 .25em .25em 0; }
  .pager li.prev a, .pager li.prev span { padding: .75em .75em .75em 1.5em; background-position: left .25em top 50%; }
  .pager li.next a, .pager li.netx span { padding: .75em 1.5em .75em .75em; background-position: right .25em top 50%; }
  .list_title.detail .bar .btn_back a { width: 5.5em; padding: 0 .5em 0 1.5em; margin-right: .5em; font-size: .75em; background-position: left .25em top 45%; background-size: 1em; border-right-width: 1px; }
  .pager_detail { margin: 3em auto 2em auto; }
  .pager_detail li a, .pager_detail li span { padding: .3em; }
  .pager_detail .prev, .pager_detail .next { width: 33%; }
  .pager_detail dt { justify-content: center; flex-wrap: wrap; }
  .pager_detail dt img { width: 100%; }
  .pager_detail dd { display: none; }
  .pager_detail .prev dt { flex-direction: column-reverse; }
  .pager_detail .back a { padding: 1em .5em 1em 1.6em; font-size: 1em; background-position: left .4em top 45%; background-size: 1em; }
  .contact_inline h3.tit { width: 100%; font-size: 2.4em; padding: .75em 0 .25em; }
  .contact_inline h3.tit::before { width: 100px; height: 49px; right: 0; }
  .contact_inline p { font-size: .8em; }
  .btn_contact_inline a { width: 94%; font-size: 1.35em; }
  .contact_inline ul { width: 95%; margin : .5em auto 0 auto; }
  .contact_inline li { width: 49%; margin-bottom: .25em; }
  .contact_inline li a { font-size: .88em; }
  .dl_files>div>p, .dl_files .files { width: 90%; font-size: .875em; margin: 1em auto; }
  .dl_files .files dt { min-height: 3em; padding-left: 4em; background-size: 3.2em; }
  .dl_files .files h4 { font-size: 1em; line-height: 1.2em; }
  .dl_files .files .size { font-size: .875em; }
  .dl_files .comment { padding: .5em .75em .25em .75em; }
  .dl_files .files .dl, .dl_files .files .dl_out { width: 9.5em; font-size: .875em; line-height: 3.4em; }
  .dl_files .info, .dl_files .info.long { min-width: 300px; width:90%; font-size: .875em; text-align: left; background-position: 0 0; }
  /*ヘッダー*/
  header { height: 60px; }
  header h1 { width: 98%; margin: 0 auto ; padding: .25em 0 .5em 1em; font-size: .555em; line-height: 1.2em; background: none; display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; position: absolute; top: auto; right: 0; bottom: 0; left: 0; }
  header h1::after { content: ''; width: 0; height: 100%; border-left: #FFF solid .3em; display: block; position: absolute; left: 0; bottom: 0;  }
  .header_wrap { width: 100%; height: 45px; margin-top: 0; }
  .headlogo { max-width: 160px; min-width: 115px; width: calc(100% - 15em); margin-left: .5em; padding-top: .5em; }
  header .headmenu ul { width: 100%; height: 0; background-color: rgba(0,176,151,0.8); box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3);  display: flex; flex-wrap: wrap; position: fixed; top: 45px; right: 0; z-index: 90; overflow: hidden; transition: .5s; }
  header .headmenu ul li { width: 50%; height: 0; border-top: #6DA solid .5px; }
  header .headmenu ul li:nth-child(odd) { border-right: #6D4 solid .5px; }
  header .headmenu a { line-height: 5em; }
  .headmenu_btn { width: 50px; height: 45px; display: flex !important; justify-content: center; align-items: center; position: fixed; top: 0; right: 0; z-index: 100; }
  .headmenu_btn span, .headmenu_btn span:before, .headmenu_btn span:after { content: ''; width: 25px; height: 3px; background-color: #FFF; border-radius: 3px; display: block; position: absolute; transition: .25s; }
  .headmenu_btn span::before { bottom: 8px; transition: .5s; }
  .headmenu_btn span::after { top: 8px; transition: .5s; }
  #headmenu-check:checked ~ .headmenu_btn span { background-color: rgba(255,255,255,0); }
  #headmenu-check:checked ~ .headmenu_btn span::before { bottom: 0; transform: rotate(45deg); }
  #headmenu-check:checked ~ .headmenu_btn span::after { top: 0; transform: rotate(-45deg); }
  #headmenu-check:checked ~ ul { height: 15em; }
  #headmenu-check:checked ~ ul li { height: 5em; }
  #headmenu-check:checked ~ .headmenu a { display: block !important; }
  header .tab_contact a { width: 10em; height: 40px; padding: 0 .5em; letter-spacing: 0; color: #00b097; background: #FFF; border-radius: 0 0 .35em .35em; top: 0; right: 50px; }
  header .tab_contact a:hover { right: 50px; }
  header .tab_contact .tab { width: 9em; height: 40px; padding: 0 0 0 2em; line-height: 40px; background-image: url(/common/img/ico/ico_mail_airplane_green.svg); background-position: top 40% left 0; background-repeat: no-repeat; background-size: 2em; display: inline-block; writing-mode: horizontal-tb; filter: none; }
  header .tab_contact .body { display: none; }
  /*フッター*/
  .footer_info { display: block; }
  .footer_info dt, .footer_info dd { display: block; }
  .footer_info dt { min-width: 240px; width: 80%; margin: 0 auto; }
  .footer_info dt a { padding: 1em 0; color: #00b097; background-color: #FFF; display: block; }
.footer_info dt a img { min-width: 120px; max-width: 160px; margin: 0 auto; }
  .footer_info dd { padding-left: 2%; }
  .footer_info h4 { margin-top: .5em; font-size: 1.2em; }
  .footer_info .office li { min-width: 100%; width: 100%; font-size: .89em; }
  .footer_info .office li .name { width: 9.5em; }
  .footmenu { width: 96%; margin: 2em auto; }
  .footmenu li { width: 31.33%; margin: .5em 1%; }
  .footmenu li.contact { width: 64.66%; }
  .footmenu li.login, .footmenu li.privacy { width: 40%; margin: 2em 5%; font-size: .8em; }
  .footmenu li a { width: 100%; border: #FFF solid 1px; }
  .copyright { font-size: 1.2em; letter-spacing: 0; line-height: 1.8; padding-bottom: 30px; }
  .copyright .sp_only { display: block; }
  /*-- TOPページ --*/
  .top_wrap h2 { font-size: 2.2em; }
  .top_wrap h2 span { font-size: .4em; }
  #top_cover { height: 88vw; padding-top: 52vw; }
  #top_cover i.hero { width: 105%; margin: 0 auto -3.5vw -2.5%; }
  #top_cover .newsticker { width: 99%; margin: 0 auto 0 0; }
  #top_cover .newsticker dt { padding-right: .5em; }
  #top_cover .newsticker dt span { padding: .25em .25em .25em .5em; }
  #top_cover .newsticker dd { width: calc(100% - 12em); }
  .cover_slider { width: 150vw; }
  .cover_slider li { margin: 0 .5vw 10vw .5vw; }
  .cover_slider li a { padding: 2px 2px 3px 2px; }
  .cover_slider li dd { display: none; }
  #top_cover2 { height: 20vw; }
  #top_about .about_body { width: 90%; padding: 50vw 5% 0 5%; text-align: left; }
  .box_division { margin-bottom: 2em; align-items: stretch; }
  .box_division p { white-space: normal; }
  .box_division a { min-height: 60px; height: 69.21px; font-size: .72em; line-height: 1.2em; }
  .box_division a span { top: 70%; bottom: 30%; }
  #top_news { padding: 3em 0 6em 0; background-size: 40vw, 10px; }
  #top_news h2 { margin-top: -1.2em; padding-top: 1.2em; background-size: 300px; }
  .top_news_list { min-width: 300px; width: 80%; margin: 1em 6% 1em 14%; }
  .top_news_list li { width: 100%; }
  .top_news_list li:nth-child(odd) { margin-right: 0; }
  .top_news_list a .update { font-size: .85em; }
  .top_news_list a .category { font-size: .8em; }
  .top_news_list a .title { font-size: 1em; }
  #top_service { padding-top: 3em; background-size: 50vw; }
  #top_service h2 { text-shadow: 0 2px 0 #FFF, 0 -2px 0 #FFF, 2px 0 0 #FFF, 2px 2px 0 #FFF, 2px -2px 0 #FFF, -2px 0 0 #FFF, -2px 2px 0 #FFF, -2px -2px 0 #FFF; }
  .top_service_list { margin: 1em auto; }
  .top_service_list li { width: 48%; margin: 0 4% .75em 0;}
  .top_service_list li:nth-child(3n+3) { margin-right: 4%; }
  .top_service_list li:nth-child(even) { margin-right: 0; }
  #top_service .btn_more { margin: 30px auto; }
  #top_service .btn_more::before { display: none; }
  #top_works h2 { padding-top: 25px; margin-top: -30px; background-size: 80px; }
  #top_works .btn_more { margin-bottom: 50px; }
  #top_works .btn_more::before { width: 50px; height: 83px; top: 2.5em; }
  .top_works_list { margin: 1em auto; }
  .top_works_list .large { width: 100%; margin: 0 0 1em 0; float: none; }
  .top_works_list .medium { width: 48%; float: left; }
  .top_works_list .medium.second { margin-right: 4%; }
  .top_works_list a dd { margin-top: .3em; }
  .top_works_list dd .genre { font-size: .6em; line-height: 1.5em; }
  .top_works_list dd p { font-size: .8em; }
  .top_works_list .medium dd, .top_works_list .medium dd p, .top_works_list .medium dd span { display: block; }
  .top_works_list .medium dd p { width: 100%; }
  .top_wrap .contact_inline { padding: 3em 0; }
  .top_wrap .contact_inline h3.tit { width: 80%; }
  #flow .read { width: 80%; }
  #flow .read span { text-align: left; }
  #faq .read { width: 86%; text-align: left; }
  .faq_list { width: 96%; }
  .faq_list .fold label { height: 4.65em; padding: .75em 1.5em .75em 4em; background-position: left 1em top 42%; }
  .faq_list .fold .answer { padding-top: 7em; }

  /*-- お知らせ一覧 --*/
  .list_title.info { margin-top: 0; }
  .list_title.info>p { padding-top: .5em; padding-right: 200px; background-size: 200px; }
  .list_title.info .listmenu dd a, .list_title.info .listmenu dd span { width: 5em; min-height: 3em; font-size: .75em; border-width: 1px; }
  .newslist li .update { font-size: .6em; }
  .newslist li .title { font-size: 1em; }
  .newslist.large { width: 98%; margin: .75em auto .25em auto; }
  .newslist.large li { width: 49%; margin: 0 2% .5em 0; padding-bottom: 1em; }
  .newslist.large li:nth-child(even) { margin-right: 0; }
  .newslist.small li { width: 96%; margin: 0 auto 1em auto; }
  .newslist.small li a { width: 100%; }
  .newslist.small li dl { align-items: center; }
  .newslist.small li dd { width: calc(100% - 5em); }
  .newslist.small li .update { width: 8em; letter-spacing: 0; }
  .newslist.small li .category { text-align: center; display: block; }
  /*-- お知らせ詳細 --*/
  .list_title.detail.info .bar h2 { font-size: 1.5em; }
  .list_title.detail.info .bar .btn_back a { height: 3.25em; line-height: 3.25em; }
  .info_body a { text-decoration: underline; }
  /*-- 制作事例一覧 --*/
  .list_title.works>p { padding-top: .25em; padding-right: 80px; font-size: 2.5em; background-size: 80px; }
  .list_title.works .bar { margin-top: -.72em; }
  .list_title.works .listmenu dd a, .list_title.works .listmenu dd span { width: 10.5em; margin-right: .25em; font-size: .75em; line-height: 2em; border-width: 1px; }
  .submenu.works { margin: 1em 1%; flex-direction: row; }
  .submenu.works li { width: 49%; margin: 0 .5% .25em .5%; }
  .submenu.works li:first-child { width: 100%; margin: 0 0 .25em 0; }
  .submenu.works a, .submenu.works span { width: auto; border-width: 1px; }
  .workslist li .update { font-size: .6em; }
  .workslist li .title { font-size: 1em; }
  .workslist li .company { font-size: .875em; margin: .75em 0 .25em auto; }
  .workslist li .read { margin-top: .5em; font-size: .875em; -webkit-line-clamp: 3; line-clamp: 3; }
  .workslist.large, .workslist.small { margin: 1em auto 0 auto; }
  .workslist.large li dl { display: block; }
  .workslist.large li dt { width: 100%; margin: 0; }
  .workslist.large li dd { width: 96%; margin: 0 auto; }
  .workslist.small { width: 98%; }
  .workslist.small li { width: 49%; margin: 0 2% .5em 0; padding-bottom: 1em; }
  .workslist.small li:nth-child(even) { margin-right: 0; }
  .workslist.medium { width: 96%; margin-top: 2em; }
  .workslist .listbody { padding-bottom: 2em; }
  .workslist .listbody>dl { display: block; }
  .workslist .listbody>dl>dt { width: 100%; margin: 0; }
  .workslist .listbody>dl>dd { width: 98%; padding-top: .5em; margin: 0 auto; }
  .workslist .listbody h3 a .label { font-size: .888em; }
  .workslist .listbody h3 a .title { margin: .125em 0 .5em 0; }
  .workslist .listbody .info dd { padding-bottom: 0; font-size: .8em; }
  .workslist .listbody .company { line-height: 1em; }
  .workslist .listbody a.anchor { margin-top: .125em; border-width: 1px; }
  /*-- 制作事例詳細 --*/
  .list_title.detail.works .bar h2 { font-size: 1.25em; line-height: 1.15em; }
  .list_title.detail.works .bar .btn_back a { height: 3.25em; line-height: 3.25em; }
  .slide-arrow { width: 24px; height: 60px; padding: 24px 7px; }
  .slide-dots { bottom: -2em; }
  .slide-dots li { margin-right: .25em; }
  .slide-dots li button { width: .5em; height: .5em; background-color: #CCC; }
  .works_detail { width: 96%; margin: 2em auto; }
  .works_detail h3 { font-size: 2em; }
  .works_detail .description dl.work, .works_detail .description dl.property { max-width: 100%; width: 100%; margin: 0 auto .5em auto; }
  .works_detail .description dd { padding: .5em 0 .5em 2em; font-size: 1.25em; }
  .works_detail .description dd li { margin: 0 1.25em .5em 0; }
  .works_body a { text-decoration: underline; }
  .works_body figure { width: 90%; }
  .other_works ul li { width: 86%; margin: 0 auto 1em auto; }
  .other_works ul li:last-child { margin-right: auto; }
  .other_works a dt img { height: auto; }
  /*-- お問合せ --*/
  .contact_wrap { padding-top: 0; }
  .contact_wrap h2 { padding-top: 1.5em; background-size: 6em; }
  .contact_wrap h2.send { background-size: 4em; }
  .contac_read, .contact_confirm, .contact_confirm, .lnk_partner a { font-size: .875em; }
  .contac_read { margin: 2em auto 1em auto; }
  .contact_confirm { margin: 3em auto; }
  .contact_send { margin: 3em auto; }
  .contact_body { width: 90%; }
  .contact_body form dt { margin-right: .2em; font-size: .875em; }
  .contact_body .control .chkbox { width: 25em; font-size: .9em; }
  .contact_body .control input[type="submit"] { font-size: 1.25em; letter-spacing: 0; }
  .contact_body .control.duo input[type="submit"] { max-width: 150px; width: 46%; margin: .5em 1%; }
  .contact_wrap .sub_topic>div { padding: 0 .75em; font-size: .875em; }
  /*-- 協力会社募集中 --*/
  .partner_wrap { padding-top: 0; }
  .partner_wrap h2 { width: 80%; height: 50px; padding: 0 50px; background-size: 50px; }
  .partner_read { font-size: .875em; }
  .partner_contact a { font-size: 1em; }
  /*-- 事業部門のご紹介 --*/
  .division_wrap { padding-top: 1em; }
  h2.tit.business span { margin-top: .5em; }
  .business_read { width: 92%; margin: 2em auto 1em; padding-top: 40vw; letter-spacing: 0; line-height: 1.5em; text-align: left; background-size: 80%; }
  .btn_division { width: 96%; }
  .btn_division dt a { padding: .5em 0; min-height: 3.4em; border-radius: .25em; }
  .btn_division dd { margin-top: .5em; font-size: .825em; line-height: 1.2em; }
  .story .comic { min-width: 260px; width: 60%; margin: 2em auto; display: block; }
  .story .comic li { width: 100%; margin-bottom: 1em; padding: 3px; border: #FFF solid 2px; }
  .story .comic li:nth-child(odd) { margin-left: 0; }
  .story .comic li::after { font-size: 1em; }
  .division_card { padding-top: 0; }
  .division_card#planning { margin-bottom: 5em; }
  .bn_division { font-size: 1.25em; line-height: 45px; }
  .bn_division { padding: 1em 0 0; line-height: 5em; }
  .bn_division::before { height: 2.5px; position: absolute; left: 0; bottom: 19.5px; }
  .bn_division img { width: 100%; max-width: 520px; margin-left: auto; position: relative; z-index: 10; }
  .division_card dl { display: block; }
  .division_card dt { width: 60%; margin: 0 auto; }
  .division_card dd { width: 96%; margin: 1em auto 0 auto; }
  .division_card dd .service { margin: 1em auto 0 auto; }
  .division_card dd .service li a { margin: 0 .25em .25em 0; padding: .5em; letter-spacing: 0; }
  /*-- 事業部門詳細 --*/
  article.division_detail_wrap { padding-top: 1em; }
  .division_d_head { margin: 2em 0 3em; }
  .division_d_head dt h3 { font-size: 1.77em; letter-spacing: 0; }
  .division_d_head dt p { width: 94%; height: 40vw; max-height: 240px; min-height: 140px; font-size: 1.42em; }
  .division_d_head dd { width: 94%; margin: 2em auto 0; }
  .division_d_head dd p { line-height: 1.5; }
  .other_division_link { padding: 2em 0 3em; }
  .other_division_link ul { width: 80%; flex-wrap: wrap; }
  .other_division_link li { width: 48%; height: 60px; margin: 1%; }
  .other_division_link li:nth-child(n+2) a { border-left: 2px solid #FFF; } 
  .division_service { margin: 4em 0 2em; }
  .division_service h3 { font-size: 1.77em; letter-spacing: 0; }
  .division_service ul { width: 94%; margin: 3em auto 0; }
  .division_service li h4 { font-size: 2em; }
  .division_service li dl { padding: 2em 1%; display: block; }
  .division_service li dt { width: 96%; max-width: 523px; min-width: 282px; margin: 0 auto; }
  .division_service li dd { width: 96%; max-width: 640px; margin: 1em auto 0; }
  .division_service li dd .sentence { margin: 1em 0 2em; }
  .division_service li dd .btn_link { max-width: 320px; }
  /*-- 企業情報 --*/
  .ceo_wrap { margin-bottom: 130px; padding: 0; }
  .ceo_body { min-width: 320px; width: 100%; height: 450px; background: url(/common/img/ceo.jpg) calc(100% + 2em) 100% no-repeat; background-size: 320px; }
  .ceo_body .ceo_title { width: 120px; }
  .ceo_body .ceo_voice { margin: 6em auto 0; padding: 0 0 1em 1%; font-size: 1.5em; display: block; }
  .ceo_body .ceo_read { max-width: 310px; width: 60%; min-height: 168px; margin: 0 auto 0 0; padding-left: 2%; font-size: .875em; }
  .ceo_body .ceo_read span { line-height: 1.5em;}
  .ceo_body .btn_division2 { width: 100%; margin: 20px 0; padding: 5px 5% 15px ; background-color: #00b097; }
  .ceo_body .btn_division2 li { margin-bottom: 0; margin-top: 2%; }
  .ceo_body .btn_division2 li:first-child { margin-left: 0; }
  .ceo_body .btn_division2 dt a { height: 48px; max-height: 48px; font-size: 1em; line-height: 1em; white-space: normal; text-overflow: clip; display: flex; align-items: center; justify-content: center; overflow: hidden; }
  .ceo_body .btn_division2 dd { font-size: .7em; text-shadow: 0 1px 0 #00b097; display: none; }
  .ceo_body .name { font-size: .875em; right: 1em; }
  .philosophy_tile { width: 75%; margin: 1em auto 0 auto; }
  .philosophy_tile li { width: 100%; padding: 1em 0 1em 1em; margin: 0 0 1em 0; }
  .philosophy_tile h4 { font-size: 2em; }
  .philosophy_tile li p { font-size: 1em; }
  .philosophy_tile li.mission { height: 15em; }
  .philosophy_tile li.vision { height: 14em; background-position: right -20px top 0; }
  .philosophy_tile li.value { height: 15em; }
  .philosophy_tile li.way { height: 19em; background-size: 45%; }
  .philosophy_tile li.mission p { margin: 3em auto 0 auto; }
  .philosophy_tile li.vision p { margin: 2em auto 0 auto; }
  .philosophy_tile li.value p { margin: 1em auto 0 auto; }
  .philosophy_tile li.way p { width: 13em; margin: 0 0 0 auto;}
  .profile_list { width: 96%; margin: 1em auto 3em auto; }
  .profile_list dt { width: 6em; font-size: .8em; }
  .profile_list dd { width: calc(100% - 4.8em); }
  .profile_list dt p, .profile_list dd p { padding: 1em .5em; }
  .profile_list dd p .zip { font-size: .8em; }
  .profile_list .icons li { max-width: 7em; }
  .profile_list .icons li img { height: 4em; }
  .profile_list .icons li.usen img { width: 7em; }
  .profile_list .icons li p { font-size: .6em; }
  .profile_list .map_add { display: block; }
  .profile_list .map_add>div { width: 100%; }
  .profile_list .map_add a.map_large { width: 100%; }
  .history { background-size: 10px, 120px; }
  .history_list { width: 90%; font-size: .875em; }
  .history_list dt { width: 5em; padding: .5em; }
  .history_list dd { width: calc(100% - 5em); padding: .5em; }
  /*-- 組織図・グループ企業 --*/
  .chart_wrap { padding: 3em 0; background-position: left 50% bottom 2em; background-size: 1em; }
  .company_chart { margin-top: 2.5em; }
  .company_chart::after { width: 27vw; height: 17.25vw; right: -6vw; top: -8vw; }
  .group_wrap { padding-bottom: 4em; background-size: 20vw; }
  .group_list { width: 92%; }
  .group_list li { padding: 1.5em 1em .5em 1em; }
  .group_list li dl { align-items: flex-start; }
  .group_list li dt { width: 25%; padding-top: 1em; }
  .group_list li dd { width: 75%; font-size: .875em; }
  .group_list li dd .name { letter-spacing: .1em; }
  .group_list li dd .companyname { font-size: 1.5em; }
  .group_list li dd .add { letter-spacing: .1em; }
  .group_list li dd .link a { line-height: 3em; }
  /*-- サービスメニュー --*/
  .service_wrap { padding: 1em 0 2em 0; background-position: right 0 bottom 13em; background-size: 35%; }
  .service_wrap h2.tit { width: 320px; padding: 0 0 1em 0; font-size: 2.8em; background-position: 0 80%; background-size: 120px; }
  .service_read { margin: 0 4%; text-align: left; }
  .service_list { width: 94%; margin: 2em auto 3em auto; }
  .service_list li { width: 49%; margin: 0 0 .75em 0; }
  .service_list li:nth-child(odd) { margin-right: 2%; }
  .service_list dt { font-size: .8em; }
  /*-- サービス詳細 --*/
  .service_detail_wrap { padding: 0 0 2em 0; }
  .list_title.service { width: 100%; overflow-x: hidden; }
  .list_title.service>p { padding: .5em 160px 0 0; background-size: 160px; white-space: nowrap; }
  .list_title.detail.service .bar h2 { font-size: 1.25em; line-height: 1.15em; }
  .list_title.detail.service .bar .btn_back a { height: 3.25em; line-height: 3.25em; }
  .service_detail_body { margin: 1em auto; }
  .service_detail_body .service_head, .service_detail_body .service_foot { width: 94%; }
  .service_detail_body .contents { width: 100vw; overflow: hidden; }
  .service_detail_body .service_head dt { width: 30%; }
  .service_detail_body .service_head .left_head dt { margin: 0 .5em .5em 0; }
  .service_detail_body .service_head .right_head dt { margin: 0 0 .5em .5em; }
  .service_detail_body .service_head .left_head.oa dt { width: 100%; float: none; display: flex; align-items: flex-start; }
  .service_detail_body .service_head .left_head.oa dt img { width: 30%; }
  .service_detail_body .service_head .left_head.oa dt p { margin: 0 0 0 1em; }
  .service_detail_body .service_head dd { padding: 0; font-size: .888em; letter-spacing: 0; line-height: 1.5em; }
  .service_detail_body .service_head dd.suggest h4 { font-size: 1.5em; }
  .service_detail_body .service_head dd.suggest.oa { width: 100%; }
  .service_detail_body .service_head dd.suggest.interior-design .copy { font-size: 1.25em; }
  .service_detail_body .service_foot { margin-top: 3em; }
  .service_detail_body .contents .deco_catch { width: 94%; font-size: 2em; }
  .service_detail_body .contents .estate .deco_catch { width: 100%; }
  .service_detail_body .contents .deco_catch span.small { font-size: .5em; }
  .service_detail_body .contents { width: 100%; }
  .service_detail_body .contents .program { width: 94%; padding-top: 45px; }
  .service_detail_body .contents .program.consultant { padding: 20px 0; }
  .service_detail_body .contents .program.estate { padding: 20px 0; }
  .service_detail_body .contents .program.estate:last-child { padding: 20px 0 0; }
  .service_detail_body .contents .program.flow { padding-bottom: 2em; background-size: 1em; }
  .service_detail_body .contents .program.lr { display: block; }
  .service_detail_body .contents .program.lr .text { width: 100%; }
  .service_detail_body .contents .program.estate .text ul { width: 100%; }
  .service_detail_body .contents .program.estate .text li { font-size: 1em; }
  .service_detail_body .contents .program.estate .text .introduction { width: 100%; }
  .service_detail_body .contents .program.lr figure { width: 80%; margin: .5em auto; }
  .service_detail_body .contents .program h3 { font-size: 1.5em; }
  .service_detail_body .contents .program.estate h3:only-child { padding: 0; }
  .service_detail_body .contents .program h3 span.round { padding: 0 1em 0 .5em; }
  .service_detail_body .contents .program .copy { margin: .8em 0 .25em 1em; font-size: 1.125em; }
  .service_detail_body .contents .program p { height: auto; padding: .5em .5em .5em 1em; letter-spacing: 0; line-height: 1.5em; }
  .service_detail_body .contents .program.consultant p { min-height: 180px; padding: 0 1em 0; background-size: 70% auto; background-position: 50% 0; position: relative; }
  .service_detail_body .contents .program.consultant p::before { content: ""; padding-top: 50%; display: block; }
  .service_detail_body .contents .program.estate p.closing_catch { width: 100%; }
  .service_detail_body .contents .program .target { margin: .5em 0 0 0; }
  .service_detail_body .contents .program .detail.d2 li, .service_detail_body .contents .program .detail.d3 li { width: 96%; margin: 1em auto 0 auto; }
  .service_detail_body .contents .program .detail.d2 li:nth-child(even), .service_detail_body .contents .program .detail.d3 li:nth-child(3n+3) { margin-right: auto; }
  .service_detail_body .contents .program .point .link_list .btn_link { margin: 0 auto; }
  .service_detail_body .contents .program .point .link_list .btn_link a { margin: .5em auto 0 auto; }
  .service_detail_body .contents .program.consultant .link_list { margin: .5em auto 0; }
  .service_detail_body .contents .program.estate .support_list { display: block; }
  .service_detail_body .contents .program.estate .support_list li { width: 100%; margin: 20px auto; }
  .service_detail_body .contents .program.estate .support_list.three_point li { max-width: 420px; }
  .service_detail_body .contents .program.estate .support_list dl { display: flex; }
  .service_detail_body .contents .program.estate .support_list dl figure { height: 100%; }
  .service_detail_body .contents .program.estate .support_list dl img { height: 100%; object-fit: cover; }
  .service_detail_body .contents .program.estate .support_list.three_point dl { display: block; }
  .service_detail_body .contents .program.estate .support_list dt { width: 30%; min-width: 150px; }
  .service_detail_body .contents .program.estate .support_list.three_point dl dt { width: 100%; min-width: auto; }
  .service_detail_body .contents .program.estate .support_list dd.support_text { width: 70%; margin: 0; padding: 1em 1em 1em; background-image: none; }
  .service_detail_body .contents .program.estate .support_list.three_point dd.support_text { width: 100%; margin: 0; padding: .5em;  background-image: none; }
  .service_detail_body .contents .achievement h4 { font-size: 1.25em; }
  .service_detail_body .contents .achievement>div { display: block; }
  .service_detail_body .contents .achievement dl:first-child { margin-right: 0; }
  .service_detail_body .contents .description { width: 90%; margin-top: 1.5em; padding: .5em 2%; }
  .service_detail_body .contents .description h4 { font-size: 1.125em; }
  .service_detail_body .contents .description>div { display: block; }
  .service_detail_body .contents .description.logo figure { width: 80%; margin: 0 auto; }
  .service_detail_body .contents .description.logo figcaption { width: 100%; padding: .5em; }
  .service_detail_body .contents .description.sign figure { width: 90%; margin: 0 auto .5em auto; }
  .service_detail_body .contents .description.sign figcaption { margin-bottom: .5em; padding-left: .5em; }
  .service_detail_body .contents .description.tool_flow h4 { background-position: top 0 left 0; }
  .service_detail_body .contents .description.tool_flow h4 span { width: 80vw; margin: 0 10px 0 -4em; padding: 0; font-size: 14px; line-height: 20px; text-align: center; display: block; }
  .service_detail_body .contents .description h4 span::after { border-width: 11px 0 11px 12px; right: -12px; }
  .service_detail_body .contents .description.tool_flow ul { margin-top: 40px; display: block; }
  .service_detail_body .contents .description.tool_flow li { width: 240px; margin: -18px auto 0 auto; }
  .service_detail_body .contents .description.tool_flow li p { width: 100%; height: 80px; font-size: 18px; line-height: 20px; border-width: 0 1px 1px 1px; overflow: hidden; }
  .service_detail_body .contents .description.tool_flow li:first-child p { border-top-width: 1px; }
  .service_detail_body .contents .description.tool_flow li p::before, .service_detail_body .contents .description.tool_flow li p::after { border-width: 18px 122px 0 122px; }
  .service_detail_body .contents .description.tool_flow li p::before { border-color: #FFF, transparent, transparent, transparent; top: 1.5px; left: -4px; }
  .service_detail_body .contents .description.tool_flow li p::after { border-color: #FFF, transparent, transparent, transparent; top: 0; left: -4px; }
  .service_detail_body .contents .description.tool_flow li span { font-size: 13px; line-height: 15px; }
  .service_detail_body .contents .description.tool_flow li .flat { padding: 35px 0 25px 0; }
  .service_detail_body .contents .description.tool_flow li .stair { padding: 30px 0 15px 0; }
  .service_detail_body .contents .description.tool_flow li .double { padding: 15px 0; font-size: 18px; line-height: 20px; }
  .service_detail_body .contents .description.tool_flow li.annotation { width: 100%; margin: 0 auto; }
  .service_detail_body .contents .description.tool_flow li.annotation span { padding: 15px 0 15px .8em; }
  .service_slider_tit { width: 94%; font-size: 1.25em; }
  .service_detail_body .contents i { width: 94%; margin: 10px auto; }
  /*-- 採用一覧 --*/
  .recruit_wrap { padding-top: .5em; }
  .recruit_about { background: none; }
  .recruit_read { margin-top: .5em; }
  .recruit_read img { border-radius: 0; }
  .recruit_read p { margin: 0 .5em 1.5em 1em; }
  .treatment { width: 84%; margin-bottom: 2em; }
  .treatment li { width: 100%; margin-bottom: 1em; }
  .recruit_body { background-image: url(/common/img/bg_recruit02.jpg); background-size: 100%; }
  .recruit_body .note { margin: 1.5em auto 1em auto; }
  .recruit_list li { margin-bottom: .5em; }
  .recruit_list li dt, .recruit_list li dd { width: 100%; }
  .recruit_list li dt { padding: .5em .25em .15em .5em; }
  .recruit_list li h4 { padding-bottom: 1em; font-size: 1.5em; }
  .recruit_list li h4::after { width: 92%; font-size: .5em; line-height: 1.5em; }
  .recruit_list li p { margin: .15em 1em; font-size: .8em; }
  .recruit_list li p span { font-size: 1.25em; }
  .recruit_list li .salary { margin-top: .75em; }
  .recruit_list li .salary span { line-height: 1.1em; }
  .recruit_body .btn a { font-size: 1.2em; letter-spacing: 0; }
  /*-- 採用詳細 --*/
  .recruit_detail_body { margin-top: -45px; padding-top: 45px; margin-bottom: 4em; }
  .recruit_detail_a { padding: 0 0 1em 0; }
  .recruit_detail_select { right: .5em; }
  .recruit_detail_select .btn_recruit_select { margin-left: .25em; }
  .recruit_detail_select .btn_recruit_select a, .recruit_detail_select .btn_recruit_select span { width: 8em; height: 4em; font-size: .8em; line-height: 4em; }
  .recruit_detail_title { width: 100%; padding: 3.15em 0 0 0; }
  .recruit_detail_title .btn_back { width: 6em; font-size: .8em; bottom: auto; top: 0; }
  .recruit_detail_title .btn_back a { line-height: 3.75em; border-width: 0 2px 2px 0; border-radius: 0 0 .5em 0; }
  .recruit_detail_title h2 { margin: 0 2%; padding: 0 0 .15em .15em; font-size: 1.8em; border-bottom-width: 2px; }
  .recruit_detail_a .badge { font-size: .9em; padding: .5em 0 0 1em; }
  .recruit_detail_rules { width: 94%; margin: .5em auto 0 auto; }
  .recruit_detail_rules h3 { font-size: .8em; }
  .recruit_detail_rules>ul>li { padding: .5em 0; }
  .recruit_detail_rules>ul>li:first-child { padding: 1em 0 .5em; }
  .recruit_detail_rules>ul>li:last-child { border-radius: 0 0 .5em .5em; }
  .recruit_detail_rules dl { display: block; }
  .recruit_detail_rules dt { width: 10em; margin: 0 auto; font-size: .8em; line-height: 2em; border: none; border-radius: 1em; }
  .recruit_detail_rules dd { width: 100%; padding: 1em .5em .75em 1em; border-color: #00b097; border-style: solid; border-width: 0 0 1px 0; }
  .recruit_detail_rules>ul>li:last-child dd { border: none; }
  .recruit_detail_rules dd li { padding: .15em .5em; }
  .recruit_entry { width: 100%; padding: 1.5em 3% 3em 3%; margin: .5em auto 0 auto; border-radius: 0; border-bottom-right-radius: 200% 4.5em; }
  .recruit_entry ul { display: block; }
  .recruit_entry li { width: 100%; margin: 1em auto; }
  /*-- お客様ログイン --*/
  .login_body dd { padding-right: 0; }
  .login_body .btn_login { width: 15em; }
  .login_body .btn_login::after { width: 68px; height: 84px; top: -55px; right: -30px; }
  .login_body .btn_login input[type="submit"] { width: 15em; }
  .document_wrap { padding-top: 1em; background: url(/common/img/bg_customer01.png) right 0 top 4em no-repeat; background-size: 4em; }
  .document_read { padding-left: 0; background: none; }
  .document_read .read { line-height: 1.2em !important; }
  .document_body .sub_topic { width: 94%; }
  .document_body .sub_topic div { padding: 0em 1em; }
  /*-- サイトマップ --*/
  .sitemap .read { font-size: .8em; }
  .sitemap dl { margin: 2.5em auto; }
  .sitemap dt { border-bottom-width: 2px; }
  .sitemap dt h3 { font-size: 1.25em; letter-spacing: 0; border-right-width: 1px; }
  .sitemap dt span { font-size: .8em; }
  .sitemap dd ul li { width: 100%; margin: .5em auto 0 auto; }
  .sitemap dd a { font-size: 1em; }

}