@charset "utf-8";
/* CSS Document */

/*============================
#topPanelArea
============================*/
#topPanelArea {}
#topPanelArea h1 {}
#topPanelArea .en {}

/*============================
#workArea
============================*/
#workArea {}
#workArea .topCopy { padding-bottom: 80px; font-size: 1.375em; line-height: 2; font-weight: 500; font-feature-settings: 'palt'; }
#workArea .content { margin-top: 40px; }
#workArea .content .container { display: flex; justify-content: space-between; margin-top: 80px; }
#workArea .content .container .top { width: 740px; }
#workArea .content .container .top .title { display: flex; align-items: center; gap: 30px; white-space: nowrap; }
#workArea .content .container .top .title .number { display: flex; align-items: center; gap: 10px; color: #00377e; font-size: 2.375em; font-weight: 800; letter-spacing: normal; }
#workArea .content .container .top .title .number span { margin-top: 6px; color: #00377e; font-size: 0.35em; font-weight: 600; letter-spacing: normal; }
#workArea .content .container .top .title .ja { color: #00377e; font-size: 2em; font-weight: 800; }
#workArea .content .container .top .copy { margin-top: 30px; line-height: 2; font-weight: 500; font-feature-settings: 'palt'; }
#workArea .content .container .image { width: 380px; height: 270px; }
#workArea .content .container .image img { width: 100%; height: auto; }
#workArea .content .note { position: relative; padding: 40px 200px 45px 150px; margin-top: 40px; background-color: #fff; }
#workArea .content .note:before { content: ''; position: absolute; top: -80px; left: 120px; transform: rotate(345deg); background-image: url("../../imageFile/work/letter_work.svg"); background-size: contain; background-repeat: no-repeat; width: 197px; height: 98px; }
#workArea .content .note.first:after { content: ''; position: absolute; left: -10px; bottom: 10px; background-image: url("../../imageFile/work/person01.png"); background-size: contain; background-repeat: no-repeat; width: 184px; height: 198px; }
#workArea .content .note.second:after { content: ''; position: absolute; left: 27px; bottom: 10px; background-image: url("../../imageFile/work/person02.png"); background-size: contain; background-repeat: no-repeat; width: 110px; height: 235px; }
#workArea .content .note.third:after { content: ''; position: absolute; left: 10px; bottom: 10px; background-image: url("../../imageFile/work/person03.png"); background-size: contain; background-repeat: no-repeat; width: 115px; height: 205px; }
#workArea .content .note .catch { display: inline-block; padding: 10px 8px 9px; background-color: #00377e; color: #fff; }
#workArea .content .note .text { margin-top: 20px; color: #001f47; line-height: 1.75; }