@charset "utf-8"; /* CSS Document */ .main-box{ background:#F9F4D4 ; padding: 37px 37px; } .main-box .mod-headingLv2,.event-list .mod-headingLv2,.archive-box .mod-headingLv2{ margin-top: 0; margin-bottom: 25px; } .main-box p{ font-size: 13px; line-height: 1.84; } .taglist{ margin-bottom: 10px; } .taglist li{ display: inline-block; width: 106px; margin-right: 5px; border-radius: 5px; padding:5px 5px; color:#fff; font-size: 14px; text-align: center; font-weight: 700; } .taglist li.medical{ background:#EC7299; } .taglist li.product{ background:#D19811; } .taglist li.logistics{ background:#B06F2B; } .taglist li.shop{ background:#519436; } .taglist li.financial{ background:#7D4698; } .taglist li.service{ background:#58C3E5; } .taglist li.maintenance{ background:#3D97D3; } .taglist li.brother{ background:#004898; } .taglist li.end{ background:#C9CACA; color: #231815; } .eventname{ font-size: 22px; line-height: 1.36; font-weight: 700; } .medcial .eventname{ color:#EC7299; } .product .eventname{ color:#D19811; } .logistics .eventname{ color:#B06F2B; } .shop .eventname{ color:#519436; } .financial .eventname{ color:#7D4698; } .service .eventname{ color:#58C3E5; } .maintenance .eventname{ color:#3D97D3; } .brother .eventname{ color:#004898; } .main-box .sub-ttl{ font-size: 15px; color:#4D4948; margin-bottom: 15px; font-weight: 700; } .main-box .sub-ttl::before{ content: "● "; } .main-box.medcial .sub-ttl::before{ color:#EC7299; } .main-box.product .sub-ttl::before{ color:#D19811; } .main-box.logistics .sub-ttl::before{ color:#B06F2B; } .main-box.shop .sub-ttl::before{ color:#519436; } .main-box.financial .sub-ttl::before{ color:#7D4698; } .main-box.service .sub-ttl::before{ color:#58C3E5; } .main-box.maintenance .sub-ttl::before{ color:#3D97D3; } .event-table{ background: #fff; padding:15px; } .event-table tr td{ font-size: 13px; line-height: 1.61; vertical-align: top; } .event-table tr td:first-child{ padding-right: 5px; -moz-text-align-last: justify; text-align-last: justify; } .event-table tr td:last-child::before{ content: ":"; } .event-btn{ max-width: 370px; width: 100%; } .event-btn a{ display: block; width: 100%; height: 100%; padding:12px 0; color:#fff; text-align: center; background: #F08307; font-size: 24px; position: relative; font-weight: 700; } .event-btn.ex a{ display: block; width: 100%; height: 100%; padding:12px 0; color:#fff; text-align: center; background: #F08307; font-size: 18px; position: relative; font-weight: 700; } .event-btn a::after{ content: ""; position: absolute; top:40%; right:12px; width: 8px; height: 16px; background: url("../img/yajirushi.png") no-repeat right top; background-size: 100%; } .event-list{ padding:56px 37px 50px; } .list-box > div{ margin-bottom: 35px; } .list-box > div:last-child{ margin-bottom: 0; } .list-box .list-ttl{ font-size: 16px; line-height: 1; color: #595957; font-weight: 700; margin-bottom: 10px; } .list-box .list-link{ font-size: 16px; line-height: 1; margin-bottom: 10px; } .list-box .list-link a{ color: #89A8CE; text-decoration: underline; } .list-box .list-tex{ font-size: 12px; line-height: 1.75; } .archive-box{ background:#EDEFF0; padding: 30px 37px 21px; } .archiveList { margin: 15px auto 0; } .archiveList__item{ margin: 0 0 15px; background: #fff; position: relative; padding: 18px 18px; box-sizing: border-box; } .archiveList__item img { width: 100%; height: auto; } .main-box .sub-ttl{ font-size: 15px; color:#4D4948; margin-bottom: 15px; font-weight: 700; } .archive-wrap.img .text-box{ width: 56%; float: left; } .archive-wrap.img .img-box{ width: 39%; float: right; } .archiveList__item .sub-ttl{ font-size: 14px; padding-left: 1.3em; text-indent: -1.3em; font-weight: 700; color: #4D4948; } .archiveList__item .eventname{ font-size: 17px; line-height: 1.4; } .event-table2 tr td{ font-size: 13px; line-height: 1.61; vertical-align: top; } .event-table2 tr td:first-child{ padding-right: 5px; -moz-text-align-last: justify; text-align-last: justify; } .event-table2 tr td:last-child::before{ content: ":"; } .event-table3 tr td{ font-size: 12px; line-height: 1.61; vertical-align: top; } .event-table3 tr td:first-child{ padding-right: 5px; -moz-text-align-last: justify; text-align-last: justify; } .event-table3 tr td:last-child::before{ content: ":"; } .archive-box .end-txt{ line-height: 1; color:#CAA735; font-size: 14px; width: 100%; text-align: center; padding-top: 4px; padding-bottom: 4px; border: 1px solid #CAA735; } .archive-box .link-btn{ width: 62%; } .archive-box .link-btn a{ line-height: 1; display: block; font-size: 14px; width: 100%; text-align: center; padding-top: 4px; padding-bottom: 4px; background: #CAA735; color:#231815; border: 1px solid #CAA735; position: relative; } .archive-box .link-btn a::after{ content: ""; position: absolute; top:30%; right:12px; width: 6px; height: 11px; background: url("../img/ex_yajirushi.png") no-repeat right top; background-size: 100%; } .archiveList__item .sub-ttl::before{ content: "● "; } .archiveList__item.medical .sub-ttl::before{ color:#EC7299; } .archiveList__item.product .sub-ttl::before{ color:#D19811; } .archiveList__item.logistics .sub-ttl::before{ color:#B06F2B; } .archiveList__item.shop .sub-ttl::before{ color:#519436; } .archiveList__item.financial .sub-ttl::before{ color:#7D4698; } .archiveList__item.service .sub-ttl::before{ color:#58C3E5; } .archiveList__item.maintenance .sub-ttl::before{ color:#3D97D3; } .archiveList__item.brother .sub-ttl::before{ color:#004898; } @media screen and (min-width: 641px) { .archiveList__item { width: 382px; } .archiveList { margin: 25px auto 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .archiveList::after { content: ""; display: block; width: 382px; } .flex-wrap{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .column__section.flex .main-box{ width: 49%; } .archiveList__item { /*width: 32%;*/ width: 382px; } .event-table2{ min-height: 60px; } .event-table3{ min-height: 76px; } } @media screen and (max-width: 640px) { .main-box{ padding: 20px 20px; } .main-box .mod-headingLv2,.event-list .mod-headingLv2,.archive-box .mod-headingLv2{ margin-top: 0; margin-bottom: 5%; } .main-box p{ font-size: 3.3vw; line-height: 1.84; } .taglist{ margin-bottom: 5%; } .taglist li{ display: inline-block; width: 106px; margin-right: 5px; border-radius: 5px; padding:5px 5px; color:#fff; font-size: 14px; text-align: center; } .eventname{ font-size:5.0vw; } .main-box .sub-ttl{ font-size: 4.4vw; margin-bottom: 4%; line-height: 1.5; text-indent: -1.3em; padding-left: 1.3em; } .event-table{ padding:4%; } .event-table tr td{ font-size: 3.3vw; line-height: 1.61; vertical-align: top; } .event-table tr td:first-child{ padding-right: 5px; -moz-text-align-last: justify; text-align-last: justify; width: 20%; } .event-table tr td:last-child{ width: 80%; } .event-table tr td:last-child::before{ content: ":"; } .event-btn{ width: 100%; } .event-btn a{ display: block; width: 100%; height: 100%; padding:6% 0; color:#fff; text-align: center; background: #F08307; font-size:5.0vw; position: relative; } .event-btn.ex a{ font-size: 4.4vw; } .event-list{ padding: 60px 20px 30px; } .list-box > div{ margin-bottom: 10%; } .list-box > div:last-child{ margin-bottom: 0; } .list-box .list-ttl{ font-size: 4.4vw; margin-bottom: 3%; } .list-box .list-link{ font-size: 4.4vw; line-height: 1.6; margin-bottom: 5%; } .list-box .list-tex{ font-size: 3.3vw; line-height: 1.75; } .archive-box{ background:#EDEFF0; padding: 30px 20px 20px; } .archiveList__item .sub-ttl{ font-size: 3.9vw; } .archiveList__item .eventname{ font-size: 4.4vw; line-height: 1.4; } .archive-box .end-txt{ font-size: 3.0vw; padding-top: 3%; padding-bottom: 3%; } .archive-box .link-btn{ width: 62%; } .archive-box .link-btn a{ font-size: 3.0vw; padding-top: 3%; padding-bottom: 3%; } .archive-box .link-btn a::after{ top:30%; right:12px; width: 6px; height: 11px; } .event-table2 tr td{ font-size: 3.0vw; line-height: 1.61; vertical-align: top; } .event-table2 tr td:first-child{ padding-right: 5px; -moz-text-align-last: justify; text-align-last: justify; width: 20%; } .event-table2 tr td:last-child{ width: 80%; } .event-table2 tr td:last-child::before{ content: ":"; } .event-table3 tr td{ font-size: 3.0vw; line-height: 1.61; vertical-align: top; } .event-table3 tr td:first-child{ padding-right: 5px; -moz-text-align-last: justify; text-align-last: justify; width: 20%; } .event-table3 tr td:last-child{ width: 80%; } .event-table3 tr td:last-child::before{ content: ":"; } }