/*
         __
   _____/ /_  ____ _      ______ _      __  __
  / ___/ __ \/ __ \ | /| / / __ `/_____/ / / /
 (__  ) / / / /_/ / |/ |/ / /_/ /_____/ /_/ /
/____/_/ /_/\____/|__/|__/\__,_/      \__,_/

hospital/disease/
DOC.CSS
*/


/*==========================================================
*
* title
*
==========================================================*/
header.title {
  padding-bottom: 30px;
}

header.title div.content img {
  float: right;
  max-width: 350px;
  margin: 0 0 1em 2em;
}

header.title div.content img.lm {
  display: none;
}

header.title div.content h1 {
  max-width: 100%;
}


/*==========================================================
*
* description
*
==========================================================*/
section.description {
  padding-bottom: 20px;
}

section.description section {
  padding-bottom: 40px;
  max-width: 900px;
  margin: 0 auto;
}

section.description section div {
  padding: 0;
}

section.description section div img {
  width: 490px;
}

section.description section div ul {
  padding-left: 1.1em;
}

section.description section p {
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-ideograph;
}

section.description section p.note {
  margin-top: 1em;
  font-size: 0.8em;
  margin-left: 1em;
  text-indent: -1em;
  line-height: 1.5;
}

section.description section p.note+p.note {
  margin-top: 0;
}

section.description section div.tabs {
  text-align: center;
}

section.description section div.tabs div.row {
  margin-top: 1em;
}

section.description section div.tabs div.row>div {
  background: #fff;
  padding: 30px;
  border-radius: 20px;
}

section.description section div.tabs div.row>div>h3 {
  padding-top: 0;
}

section.description section div.tabs div.row>div>div>div {
  background: #EAF1FA;
  margin-top: 1em;
  padding: 20px;
  border-radius: 10px;
}

section.description section div.tabs div.row>div>div>div strong {
  color: #0082D9;
  border: 1px solid #0082D9;
  font-weight: 500;
  display: inline-block;
  padding: 0 0.25em;
}

/*==========================================================
*
* #check
*
==========================================================*/
section#check section {
  max-width: 980px;
}

section#check section div.body {
  max-width: 960px;
  margin: 0 auto;
  padding: 0;
  column-count: 3;
  column-gap: 40px;
  text-align: justify;
  text-justify: inter-ideograph;
}

section#check label {
  display: block;
}

[type=checkbox]+.checkable {
  position: relative;
  display: inline-block;
}

[type=checkbox]+.checkable:after {
  position: absolute;
  transform: none;
  transition: none;
}

[type=checkbox]:checked+.checkable:after {
  transform: none;
  transition: none;
  top: 20%;
}

/*==========================================================
*
*  mobile
*
==========================================================*/

@media (max-width:980px) {
  header.title div.content img {
    max-width: 300px;
    margin: 0 0 1em 2em;
  }

  section#check section.flex {
    width: 100%;
  }

  section#check section div.body {
    max-width: 700px;
    column-count: 2;
  }
}

@media (max-width:750px) {
  section#check section div.body {
    column-gap: 20px;
    margin: 0 2em;
  }

  header.title div.content img.pc {
    display: none;
  }

  header.title div.content img.lm {
    display: block;
    margin-top: 1em;
  }
}

@media (max-width:680px) {
  header.title div.content img {
    max-width: 50%;
    margin: 0 0 1em 2em;
  }

  section#check section div.body {
    column-count: 1;
    margin: 0 1em;
  }
}

@media (max-width:360px) {
  section#check section div.body {
    font-size: 0.9375em;
  }
}