/* Function */
.blank { margin: 0; height: 1px; border: none; }

.blank-10px { margin: 5px 0px; height: 1px; border: none; }

.blank-20px { margin: 10px 0px; height: 1px; border: none; }

.blank-30px { margin: 15px 0px; height: 1px; border: none; }

.blank-40px { margin: 20px 0px; height: 1px; border: none; }

.blank-50px { margin: 25px 0px; height: 1px; border: none; }

.blank-solid { margin: 10px 0px; height: 1px; border: none; border-bottom: 1px solid #CCC; }

.blank-dotted { margin: 10px 0px; height: 1px; border: none; border-bottom: 1px dotted #CCC; }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, figure { margin: 0; padding: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; }

html { overflow-y: scroll; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }

ol, ul { list-style: none; }

fieldset, img { border: 0; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th { text-align: left; }

address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }

/* Setting */
html { font-size: 16px; }

body { background-color: white; font-family: Avenir Next, Avenir, Arial, Helvetica, sans-serif; word-wrap: break-word; color: #0094DC; -webkit-text-size-adjust: 100%; -webkit-overflow-scrolling: touch; }

a { text-decoration: underline; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.6); }

a:link, a:visited { color: red; }

a:hover, a:active, a:focus { color: #ff6666; }

/* Content */
.firstview { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100vw; height: 100vh; }

@media screen and (max-width: 599px) { .firstview { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; } }

@media screen and (max-width: 599px) { .firstview .info { padding-bottom: 50px; font-size: 13px; font-size: 0.8125rem; } }

.firstview .info .logo { padding-bottom: 30px; font-size: 0px; font-size: 0rem; }

.firstview .info .logo img { width: 200px; }

.firstview .info h1 { padding-bottom: 0.5rem; }

.firstview .face { font-size: 0px; font-size: 0rem; }

@media screen and (min-width: 600px) { .firstview .face { padding-left: 50px; } }

.firstview .face img { width: 185px; }

@media screen and (max-width: 599px) { .firstview .face img { width: 120px; } }

.works { padding: 50px 0 200px 0; }

.works .list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 1140px; margin: auto; }

@media screen and (max-width: 599px) { .works .list { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 10px; width: 100%; } }

@media screen and (min-width: 600px) { .works .list li { position: relative; width: 380px; height: 230px; font-size: 0px; font-size: 0rem; }
  .works .list li .info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #0094DC; color: white; font-size: 16px; font-size: 1rem; opacity: 0; filter: alpha(opacity=0); -webkit-transition: .5s; -o-transition: .5s; transition: .5s; }
  .works .list li .info:hover { opacity: 0.9; filter: alpha(opacity=90); }
  .works .list li .info dt { padding-bottom: 5px; font-size: 16px; font-size: 1rem; }
  .works .list li .info dd { font-size: 12px; font-size: 0.75rem; }
  .works .list li .thumb { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
  .works .list li .thumb img { width: 100%; } }

@media screen and (max-width: 599px) { .works .list li { padding-bottom: 15px; width: 100%; font-size: 0px; font-size: 0rem; }
  .works .list li .info { padding-top: 5px; text-align: center; }
  .works .list li .info dt { font-size: 14px; font-size: 0.875rem; }
  .works .list li .info dd { font-size: 10px; font-size: 0.625rem; }
  .works .list li .thumb { overflow: hidden; border-radius: 5px; }
  .works .list li .thumb img { width: 100%; } }

.services { padding: 100px 0; }

@media screen and (max-width: 599px) { .services { padding: 0 0 50px 0; } }

.services .list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: auto; width: 1000px; }

@media screen and (max-width: 599px) { .services .list { display: block; padding: 10px; width: 100%; } }

.services .list li { padding-bottom: 80px; width: 50%; text-align: center; }

@media screen and (max-width: 599px) { .services .list li { padding-bottom: 50px; width: 100%; } }

.services .list li .icon { padding-bottom: 10px; font-size: 0px; font-size: 0rem; }

.services .list li .icon img { width: 100px; }

@media screen and (max-width: 599px) { .services .list li .icon img { width: 80px; } }

.services .list li .info { font-size: 13px; font-size: 0.8125rem; }

@media screen and (max-width: 599px) { .services .list li .info { font-size: 10px; font-size: 0.625rem; } }

.services .list li .info h2 { font-size: 32px; font-size: 2rem; }

@media screen and (max-width: 599px) { .services .list li .info h2 { font-size: 24px; font-size: 1.5rem; } }

.profile { padding-bottom: 150px; font-size: 12px; font-size: 0.75rem; text-align: center; }

.profile ul { display: inline-block; padding: 50px; background-color: rgba(0, 148, 220, 0.07); border-radius: 9999px; }

.profile ul li { padding: 10px 0; }

footer { padding: 10px; font-size: 10px; font-size: 0.625rem; text-align: center; }
