@charset "utf-8";

nav[role='breadcrumb'] {}

main
{
  text-align: center;
}


/* ------------------------------------------------------------

  #index

------------------------------------------------------------ */


#index > h2 {
  margin-bottom: 4em;
  border: 0;
}

#index > h2 span {
  line-height: 1.15;
}

#index > h2 span small {
  font-size: 22px;
  line-height: 1;
}

#index a.ico-loupe
{
  display: inline-block;
  position: relative;
}

#index a.ico-loupe:before
{
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 7px;
  right: 6px;
  width: 1.8em;
  height: 1.8em;
  background-image: url(/store/techo/pc/en/2017/all_about/images/ico_loupe.svg);
  background-repeat: no-repeat;
  background-size: 1.8em 1.8em;
}

/* --------------------------------------------------------- */


#index #section_01 {
  margin-bottom: 8em;
}

#index #section_01 > ul,
#index #section_01 > ul li
{
  box-sizing: border-box;
}

#index #section_01 > ul {
  width: 96em;
  margin: 0 auto;
  border-right: 1px solid #CCC;
}

#index #section_01 > ul li {
  display: inline-block;
  width: 25%;
  border-left: 1px solid #CCC;
  vertical-align: top;
}

#index #section_01 > ul li a {
  display: block;
  color: #000;
}

#index #section_01 > ul li a h3 {
  margin-bottom: 2.4em;
}

#index #section_01 > ul li:nth-of-type(1) a h3
{
  color: #A53E5C;
}

#index #section_01 > ul li:nth-of-type(2) a h3
{
  color: #5C2849;
}

#index #section_01 > ul li:nth-of-type(3) a h3
{
  color: #EA4863;
}

#index #section_01 > ul li:nth-of-type(4) a h3
{
  color: #1FCCC9;
}

#index #section_01 > ul li a h3 span {
  font-size: 29px;
  line-height: 1.1;
}

#index #section_01 > ul li a h3 span small {
  font-size: 21px;
  line-height: 1;
}

#index #section_01 > ul li a h3 + p {
  min-height: 5.4em;
  margin: 0 .4em 0 .4em;
  /*
  font-size: 13px;
  line-height: 1.285;
  */
  font-size: 15px;
  line-height: 1.35;
}

#index #section_01 > ul li a div.img_01 {
  width: 100%;
  height: 152px;
  margin-bottom: 1em;
  text-align: center;
}

#index #section_01 > ul li a div.img_01:after
{
  content: "";
  display: inline-block;
  height: 152px;
  vertical-align: middle;
}

#index #section_01 > ul li a div.img_01 img
{
  vertical-align: middle;
}

#index #section_01 > ul li a dl
{
  margin: 0 1.8em 1.2em 1.8em;
  text-align: left;
}

#index #section_01 > ul li a dl dt,
#index #section_01 > ul li a dl dd
{
  box-sizing: border-box;
  padding: 0 .6em;
  margin-bottom: .3em;
}

#index #section_01 > ul li a dl dt
{
  background-color: #D9D9D9;
  font-weight: bold;
}

#index #section_01 > ul li a dl dd:last-child
{
  margin-bottom: 0;
}

#index #section_01 > ul li a dl dt span,
#index #section_01 > ul li a dl dd span
{
  font-size: 13px;
  line-height: 1.307;
}

#index #section_01 > ul li a div.container_01
{
  min-height: 9.3em;
  margin-bottom: 1em;
}

#index #section_01 > ul li a div.container_01 h4
{
  margin-bottom: .3em;
}

#index #section_01 > ul li:nth-of-type(1) a div.container_01 h4
{
  color: #A53E5C;
}

#index #section_01 > ul li:nth-of-type(2) a div.container_01 h4
{
  color: #5C2849;
}

#index #section_01 > ul li:nth-of-type(3) a div.container_01 h4
{
  color: #EA4863;
}

#index #section_01 > ul li:nth-of-type(4) a div.container_01 h4
{
  color: #1FCCC9;
}

#index #section_01 > ul li a div.container_01 h4 span
{
  font-size: 16px;
  line-height: 1;
}

#index #section_01 > ul li a div.container_01 h4 span small
{
  font-size: 12px;
  line-height: 1;
}

#index #section_01 > ul li a div.container_01 div
{
  text-align: left;
}

#index #section_01 > ul li a div.container_01 div:after
{
  content: "";
  display: inline-block;
  height: 74px;
  vertical-align: middle;
}

#index #section_01 > ul li a div.container_01 div img
{
  margin: 0 .8em 0 1.8em;
  vertical-align: middle;
}

#index #section_01 > ul li a div.container_01 div p
{
  display: inline-block;
  width: 11em;
  font-size: 12px;
  line-height: 1.25;
  vertical-align: middle;
}

#index #section_01 > ul li a div.mdi-chevron-right
{
  box-sizing: border-box;
  position: relative;
  height: 3.5em;
  margin: 0 1.8em;
  padding-top: .2em;
  border-radius: 5px;
  color: #FFF;
}

#index #section_01 > ul li:nth-of-type(1) a div.mdi-chevron-right
{
  background-color: #A53E5C;
}

#index #section_01 > ul li:nth-of-type(2) a div.mdi-chevron-right
{
  background-color: #5C2849;
}

#index #section_01 > ul li:nth-of-type(3) a div.mdi-chevron-right
{
  background-color: #EA4863;
}

#index #section_01 > ul li:nth-of-type(4) a div.mdi-chevron-right
{
  background-color: #1FCCC9;
}

#index #section_01 > ul li a div.mdi-chevron-right:before
{  
  position: absolute;
  top: 50%;
  right: 6px;
  margin-top: -.5em;
  font-size: 17px;
  line-height: 1;
}

#index #section_01 > ul li a div.mdi-chevron-right:after
{
  content: "";
  display: inline-block;
  height: 3.5em;
  vertical-align: middle;
}

#index #section_01 > ul li a div span
{
  font-size: 17px;
  line-height: 1;
  vertical-align: middle;
}

/* --------------------------------------------------------- */


#index #section_02 {
  margin-bottom: 8em;
}

#index #section_02 h3 {
  display: inline-block;
  margin-bottom: 10em;
  font-size: 18px;
  line-height: 1.6;
  border-bottom: 3px solid #000;
}

#index #section_02 table {
  width: 96em;
  margin: 0 auto 0 auto;
  border-bottom: 1px solid #CCC;
  border-right: 1px solid #CCC;
}

#index #section_02 table thead tr th,
#index #section_02 table tbody tr th,
#index #section_02 table tbody tr td {
  box-sizing: border-box;
}

#index #section_02 table tbody tr th,
#index #section_02 table tbody tr td {
  border-top: 1px solid #CCC;
  border-left: 1px solid #CCC;
}

#index #section_02 table thead tr th {
  position: relative;
  padding: .7em 0 .5em 0;
  border-left: 1px solid #CCC;
}

#index #section_02 table thead tr th:nth-of-type(1)
{
  border-left: 0;
}

#index #section_02 table thead tr th:nth-of-type(2)
{
  width: 21em;
  border-left: 0;
  background-color: #A53E5C;
}

#index #section_02 table thead tr th:nth-of-type(3)
{
  width: 10.5em;
  background-color: #5C2849;
}

#index #section_02 table thead tr th:nth-of-type(4)
{
  width: 10.5em;
  background-color: #5C2849;
}

#index #section_02 table thead tr th:nth-of-type(5)
{
  width: 10.5em;
  background-color: #EA4863;
}

#index #section_02 table thead tr th:nth-of-type(6)
{
  width: 10.5em;
  background-color: #EA4863;
}

#index #section_02 table thead tr th:nth-of-type(7)
{
  width: 21em;
  background-color: #1FCCC9;
}

#index #section_02 table thead tr th img
{
  position: absolute;
}

#index #section_02 table thead tr th:nth-of-type(2) img
{
  top: -103px;
  left: 55px;
}

#index #section_02 table thead tr th:nth-of-type(3) img
{
  top: -103px;
  left: 7px;
}

#index #section_02 table thead tr th:nth-of-type(4) img
{
  top: -112px;
  left: 0;
}

#index #section_02 table thead tr th:nth-of-type(5) img
{
  top: -135px;
  left: 0;
}

#index #section_02 table thead tr th:nth-of-type(6) img
{
  top: -149px;
  left: -4px;
}

#index #section_02 table thead tr th:nth-of-type(7) img
{
  top: -122px;
  left: 52px;
}

#index #section_02 table thead tr th span
{
  color: #FFF;
  font-size: 13px;
  line-height: 1;
}

#index #section_02 table tbody tr th > span
{
  font-size: 12px;
  line-height: 1.416;
}

#index #section_02 table tbody tr td
{
  padding: 1.5em 0;
}

#index #section_02 table tbody tr td > span
{
  font-size: 13px;
  line-height: 1.307;
  display: block;
  margin: 0 0.8em 0.8em;
}
#index #section_02 table tbody tr td > span + span {
  margin-bottom: 0;
  padding-top: 0.8em;
  border-top: 1px solid #CCC;
}

#index #section_02 table tbody tr:nth-of-type(2) td
{
  padding: .8em;
}

#index #section_02 table tbody tr:nth-of-type(2) td dl
{
  position: relative;
}

#index #section_02 table tbody tr:nth-of-type(2) td dl dt
{
  position: absolute;
  width: 1.727em;
  padding-top: .181em;
  font-size: 11px;
  line-height: 1.909;
}

#index #section_02 table tbody tr:nth-of-type(2) td dl dt:first-child
{
  position: static;
  width: auto;
  font-size: 13px;
  line-height: 1.692;
  text-align: center;
}

#index #section_02 table tbody tr:nth-of-type(2) td dl dd
{
  border-top: 1px solid #CCC;
  font-size: 13px;
  line-height: 1.692;
}

#index #section_02 table tbody tr:nth-of-type(2) td dl dt span,
#index #section_02 table tbody tr:nth-of-type(2) td dl dd span
{
  display: inline-block;
  width: 50%;
}

#index #section_02 table tbody tr:nth-of-type(2) td dl dt span:last-child,
#index #section_02 table tbody tr:nth-of-type(2) td dl dd span:last-child
{
  border-left: 1px solid #CCC;
}

#index #section_02 table tbody tr:nth-of-type(2) td dl dd span:first-child
{
  padding-left: .684em;
}

#index #section_02 table tbody tr:nth-of-type(10) td
{
  vertical-align: top;
}

#index #section_02 table tbody tr:nth-of-type(10) td a.ico-loupe
{
  margin-bottom: 1.2em;
}

#index #section_02 table tbody tr:nth-of-type(10) td ul
{
  margin: 0 1em 0 2.8em;
}

#index #section_02 table tbody tr:nth-of-type(10) td ul li
{
  position: relative;
  padding-left: 1em;
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
}

#index #section_02 table tbody tr:nth-of-type(10) td ul li:before
{
  content: "-";
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  text-align: center;
}

#index #section_02 table tbody tr:nth-of-type(11) td
{
  vertical-align: top;
}

#index #section_02 table tbody tr:nth-of-type(11) td img
{
  display: block;
  margin: 0 auto 1em auto;
}

#index #section_02 table tbody tr:nth-of-type(11) td span
{
  display: inline-block;
}

#index #section_02 table tbody tr:nth-of-type(12) td
{
  padding-left: 1.4em;
  padding-right: 1.4em;
}

#index #section_02 table tbody tr:nth-of-type(12) td a
{
  position: relative;
  box-sizing: border-box;
  display: block;
  height: 2.8em;
  margin: 0 auto;
  padding-top: .1em;
  border-radius: 5px;
  vertical-align: middle;
}

#index #section_02 table tbody tr:nth-of-type(12) td a:after
{
  content: "";
  display: inline-block;
  vertical-align: middle;
}

#index #section_02 table tbody tr:nth-of-type(12) td a.ico-cart
{
  margin-bottom: 1em;
  padding-left: 1.4em;
  border: 1px solid #7D7D7D;
  color: #7D7D7D;
}

#index #section_02 table tbody tr:nth-of-type(12) td a.ico-cart:before
{
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 37px;
  width: 1.9em;
  height: 1.9em;
  margin-top: -1em;
  background-image: url(/store/techo/pc/en/2017/all_about/images/ico_cart.svg);
  background-repeat: no-repeat;
  background-size: 1.9em 1.9em;
}

#index #section_02 table tbody tr:nth-of-type(12) td a.ico-cart:after
{
  height: 2.6em;
}

#index #section_02 table tbody tr:nth-of-type(12) td a.ico-cart span
{
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
}

#index #section_02 table tbody tr:nth-of-type(12) td a.mdi-chevron-right
{
  background-color: #7D7D7D;
  color: #FFF;
}

#index #section_02 table tbody tr:nth-of-type(12) td a.mdi-chevron-right:before
{
  position: absolute;
  top: 50%;
  right: 1px;
  margin-top: -.51em;
  font-size: 17px;
  line-height: 1;
}

#index #section_02 table tbody tr:nth-of-type(12) td a.mdi-chevron-right:after
{
  height: 2.8em;
}

#index #section_02 table tbody tr:nth-of-type(12) td a.mdi-chevron-right span
{
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
}

#index #section_02 table tbody tr:nth-of-type(13) td
{
  padding-left: 1.4em;
  padding-right: 1.4em;
}

#index #section_02 table tbody tr:nth-of-type(13) td img
{
  display: block;
  margin: 0 auto .6em auto;
}

#index #section_02 table tbody tr:nth-of-type(13) td > span
{
  display: inline-block;
  margin-bottom: .3em;
  font-size: 13px;
  line-height: 1.307;
}

#index #section_02 table tbody tr:nth-of-type(13) td a.mdi-chevron-right
{
  position: relative;
  box-sizing: border-box;
  display: block;
  height: 2.8em;
  margin: 0 auto;
  padding-top: .1em;
  border-radius: 5px;
  color: #FFF;
  vertical-align: middle;
}

#index #section_02 table tbody tr:nth-of-type(13) td a.mdi-chevron-right:before
{
  position: absolute;
  top: 50%;
  right: 1px;
  margin-top: -.51em;
  font-size: 17px;
  line-height: 1;
}

#index #section_02 table tbody tr:nth-of-type(13) td a.mdi-chevron-right:after
{
  content: "";
  display: inline-block;
  height: 2.8em;
  vertical-align: middle;
}

#index #section_02 table tbody tr:nth-of-type(13) td:nth-of-type(1) a.mdi-chevron-right
{
  background-color: #5C2849;
}

#index #section_02 table tbody tr:nth-of-type(13) td:nth-of-type(2) a.mdi-chevron-right
{
  background-color: #EA4863;
}

#index #section_02 table tbody tr:nth-of-type(13) td:nth-of-type(3) a.mdi-chevron-right
{
  background-color: #1FCCC9;
}

#index #section_02 table tbody tr:nth-of-type(13) td a.mdi-chevron-right span
{
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
}


/* ------------------------------------------------------------

  #planner, #original, #cousin, #weeks

------------------------------------------------------------ */


#planner nav[role='breadcrumb'],
#original nav[role='breadcrumb'],
#cousin nav[role='breadcrumb'],
#weeks nav[role='breadcrumb']
{
  margin-bottom: 4em;
}

#planner > h2,
#original > h2,
#cousin > h2,
#weeks > h2 {
  margin-bottom: 4em;
  border: 0;
}

#planner > h2 span,
#original > h2 span,
#cousin > h2 span,
#weeks > h2 span {
  line-height: 1.15;
}

#planner a.ico-loupe,
#original a.ico-loupe,
#cousin a.ico-loupe,
#weeks a.ico-loupe
{
  display: inline-block;
  position: relative;
}

#planner a.ico-loupe:before,
#original a.ico-loupe:before,
#cousin a.ico-loupe:before,
#weeks a.ico-loupe:before
{
  content: "";
  display: inline-block;
  position: absolute;
  bottom: 17px;
  right: 17px;
  width: 2.2em;
  height: 2.2em;
  background-image: url(/store/techo/pc/en/2017/all_about/images/ico_loupe.svg);
  background-repeat: no-repeat;
  background-size: 2.2em 2.2em;
}


/* --------------------------------------------------------- */


#nav-model
{
  width: 96em;
  margin: 0 auto 1.5em auto;
}

#nav-model li
{
  box-sizing: border-box;
  display: inline-block;
  width: 25%;
  height: 7.5em;
  border-left: 1px solid #CCC;
}

#nav-model li:last-child
{
  border-right: 1px solid #CCC;
}

#nav-model li a
{
  box-sizing: border-box;
  display: block;
  height: 7.5em;
}

#nav-model li a:after
{
  content: "";
  display: inline-block;
  height: 7.5em;
  vertical-align: middle;
}

#nav-model li:nth-of-type(1) a
{
  color: #A53E5C;
}

#nav-model li:nth-of-type(2) a
{
  color: #5C2849;
}

#nav-model li:nth-of-type(3) a
{
  color: #EA4863;
}

#nav-model li:nth-of-type(4) a
{
  color: #1FCCC9;
}

#planner #nav-model li:nth-of-type(1) a,
#original #nav-model li:nth-of-type(2) a,
#cousin #nav-model li:nth-of-type(3) a,
#weeks #nav-model li:nth-of-type(4) a
{
  height: 9em;
  color: #FFF;
}

#planner #nav-model li:nth-of-type(1) a
{
  background-color: #A53E5C;
}

#original #nav-model li:nth-of-type(2) a
{
  background-color: #5C2849;
}

#cousin #nav-model li:nth-of-type(3) a
{
  background-color: #EA4863;
}

#weeks #nav-model li:nth-of-type(4) a
{
  background-color: #1FCCC9;
}

#planner #nav-model li:nth-of-type(1) a.btn-permeate,
#original #nav-model li:nth-of-type(2) a.btn-permeate,
#cousin #nav-model li:nth-of-type(3) a.btn-permeate,
#weeks #nav-model li:nth-of-type(4) a.btn-permeate
{
  opacity: 1;
  transition: none;
}

#nav-model li a span
{
  display: inline-block;
  font-size: 30px;
  line-height: 1.1;
  vertical-align: middle;
}

#nav-model li a span small
{
  font-size: 22px;
  line-height: 1;
}


/* --------------------------------------------------------- */


#nav-func_01
{
  position: relative;
  width: 96em;
  margin: 0 auto 2em auto;
  text-align: left;
  z-index: 2;
}

#planner #nav-func_01
{
  border-top: 5px solid #A53E5C;
}

#original #nav-func_01
{
  border-top: 5px solid #5C2849;
}

#cousin #nav-func_01
{
  border-top: 5px solid #EA4863;
}

#weeks #nav-func_01
{
  border-top: 5px solid #1FCCC9;
}

#nav-func_01 li
{
  display: inline-block;
  width: 9.3em;
  height: 10.9em;
  vertical-align: top;
}

#planner #nav-func_01 li
{
  border-left: 1px solid #A53E5C;
}

#original #nav-func_01 li
{
  border-left: 1px solid #5C2849;
}

#cousin #nav-func_01 li
{
  border-left: 1px solid #EA4863;
}

#weeks #nav-func_01 li
{
  border-left: 1px solid #1FCCC9;
}

#nav-func_01 li:nth-last-of-type(1),
#nav-func_01 li:nth-last-of-type(2)
{
  width: 9.4em;
}

#planner #nav-func_01 li:nth-last-of-type(1),
#planner #nav-func_01 li:nth-last-of-type(2)
{
  border-right: 1px solid #A53E5C;
}

#original #nav-func_01 li:nth-last-of-type(1),
#original #nav-func_01 li:nth-last-of-type(2)
{
  border-right: 1px solid #5C2849;
}

#cousin #nav-func_01 li:nth-last-of-type(1),
#cousin #nav-func_01 li:nth-last-of-type(2)
{
  border-right: 1px solid #EA4863;
}

#weeks #nav-func_01 li:nth-last-of-type(1),
#weeks #nav-func_01 li:nth-last-of-type(2)
{
  border-right: 1px solid #1FCCC9;
}

#nav-func_01 li:nth-last-of-type(1)
{
  margin-left: 2.8em;
}

#planner #nav-func_01 li:nth-last-of-type(1)
{
  margin-left: 12.1em;
}

#nav-func_01 li a
{
  display: block;
  padding-top: 4.5em;
  background-repeat: no-repeat;
}

#nav-func_01 li:nth-of-type(2) a
{
  background-position: -92px 0;
}

#nav-func_01 li:nth-of-type(3) a
{
  background-position: -184px 0;
}

#nav-func_01 li:nth-of-type(4) a
{
  background-position: -276px 0;
}

#nav-func_01 li:nth-of-type(5) a
{
  background-position: -368px 0;
}

#nav-func_01 li:nth-of-type(6) a
{
  background-position: -460px 0;
}

#nav-func_01 li:nth-of-type(7) a
{
  background-position: -552px 0;
}

#nav-func_01 li:nth-of-type(8) a
{
  background-position: -644px 0;
}

#nav-func_01 li:nth-of-type(9) a
{
  background-position: -736px 0;
}

#nav-func_01 li:nth-of-type(10) a
{
  background-position: -828px 0;
}

#planner #nav-func_01 li a
{
  background-image: url(/store/techo/pc/en/2017/all_about/planner/images/nav.png);
  color: #A53E5C;
}

#original #nav-func_01 li a
{
  background-image: url(/store/techo/pc/en/2017/all_about/original/images/nav.png);
  color: #5C2849;
}

#cousin #nav-func_01 li a
{
  background-image: url(/store/techo/pc/en/2017/all_about/cousin/images/nav.png);
  color: #EA4863;
}

#weeks #nav-func_01 li a
{
  background-image: url(/store/techo/pc/en/2017/all_about/weeks/images/nav.png);
  color: #1FCCC9;
}

.a01 #nav-func_01 li:nth-of-type(1) a.btn-permeate,
.a02 #nav-func_01 li:nth-of-type(2) a.btn-permeate,
.a03 #nav-func_01 li:nth-of-type(3) a.btn-permeate,
.a04 #nav-func_01 li:nth-of-type(4) a.btn-permeate,
.a05 #nav-func_01 li:nth-of-type(5) a.btn-permeate,
.a06 #nav-func_01 li:nth-of-type(6) a.btn-permeate,
.a07 #nav-func_01 li:nth-of-type(7) a.btn-permeate,
.a08 #nav-func_01 li:nth-of-type(8) a.btn-permeate,
.a09 #nav-func_01 li:nth-of-type(9) a.btn-permeate,
.a10 #nav-func_01 li:nth-of-type(10) a.btn-permeate
{
  opacity: 1;
  transition: none;
}

#nav-func_01 li a div
{
  width: 9.4em;
  height: 6.4em;
  margin-left: -.1em;
  border-radius: 0 0 5px 5px;
  text-align: center;
}

#nav-func_01 li a div:after
{
  content: "";
  display: inline-block;
  height: 6.4em;
  vertical-align: middle;
}

.a01 #nav-func_01 li:nth-of-type(1) a div, .a01 #nav-func_01 li:nth-of-type(1) a div:after,
.a02 #nav-func_01 li:nth-of-type(2) a div, .a02 #nav-func_01 li:nth-of-type(2) a div:after,
.a03 #nav-func_01 li:nth-of-type(3) a div, .a03 #nav-func_01 li:nth-of-type(3) a div:after,
.a04 #nav-func_01 li:nth-of-type(4) a div, .a04 #nav-func_01 li:nth-of-type(4) a div:after,
.a05 #nav-func_01 li:nth-of-type(5) a div, .a05 #nav-func_01 li:nth-of-type(5) a div:after,
.a06 #nav-func_01 li:nth-of-type(6) a div, .a06 #nav-func_01 li:nth-of-type(6) a div:after,
.a07 #nav-func_01 li:nth-of-type(7) a div, .a07 #nav-func_01 li:nth-of-type(7) a div:after,
.a08 #nav-func_01 li:nth-of-type(8) a div, .a08 #nav-func_01 li:nth-of-type(8) a div:after,
.a09 #nav-func_01 li:nth-of-type(9) a div, .a09 #nav-func_01 li:nth-of-type(9) a div:after,
.a10 #nav-func_01 li:nth-of-type(10) a div, .a10 #nav-func_01 li:nth-of-type(10) a div:after
{
  height: 9.9em;
}

#planner.a01 #nav-func_01 li:nth-of-type(1) a div,
#planner.a02 #nav-func_01 li:nth-of-type(2) a div,
#planner.a03 #nav-func_01 li:nth-of-type(3) a div,
#planner.a04 #nav-func_01 li:nth-of-type(4) a div,
#planner.a05 #nav-func_01 li:nth-of-type(5) a div,
#planner.a06 #nav-func_01 li:nth-of-type(6) a div,
#planner.a07 #nav-func_01 li:nth-of-type(7) a div,
#planner.a08 #nav-func_01 li:nth-of-type(8) a div,
#planner.a09 #nav-func_01 li:nth-of-type(9) a div,
#planner.a10 #nav-func_01 li:nth-of-type(10) a div
{
  background-color: #A53E5C;
}

#original.a01 #nav-func_01 li:nth-of-type(1) a div,
#original.a02 #nav-func_01 li:nth-of-type(2) a div,
#original.a03 #nav-func_01 li:nth-of-type(3) a div,
#original.a04 #nav-func_01 li:nth-of-type(4) a div,
#original.a05 #nav-func_01 li:nth-of-type(5) a div,
#original.a06 #nav-func_01 li:nth-of-type(6) a div,
#original.a07 #nav-func_01 li:nth-of-type(7) a div,
#original.a08 #nav-func_01 li:nth-of-type(8) a div,
#original.a09 #nav-func_01 li:nth-of-type(9) a div,
#original.a10 #nav-func_01 li:nth-of-type(10) a div
{
  background-color: #5C2849;
}

#cousin.a01 #nav-func_01 li:nth-of-type(1) a div,
#cousin.a02 #nav-func_01 li:nth-of-type(2) a div,
#cousin.a03 #nav-func_01 li:nth-of-type(3) a div,
#cousin.a04 #nav-func_01 li:nth-of-type(4) a div,
#cousin.a05 #nav-func_01 li:nth-of-type(5) a div,
#cousin.a06 #nav-func_01 li:nth-of-type(6) a div,
#cousin.a07 #nav-func_01 li:nth-of-type(7) a div,
#cousin.a08 #nav-func_01 li:nth-of-type(8) a div,
#cousin.a09 #nav-func_01 li:nth-of-type(9) a div,
#cousin.a10 #nav-func_01 li:nth-of-type(10) a div
{
  background-color: #EA4863;
}

#weeks.a01 #nav-func_01 li:nth-of-type(1) a div,
#weeks.a02 #nav-func_01 li:nth-of-type(2) a div,
#weeks.a03 #nav-func_01 li:nth-of-type(3) a div,
#weeks.a04 #nav-func_01 li:nth-of-type(4) a div,
#weeks.a05 #nav-func_01 li:nth-of-type(5) a div,
#weeks.a06 #nav-func_01 li:nth-of-type(6) a div,
#weeks.a07 #nav-func_01 li:nth-of-type(7) a div,
#weeks.a08 #nav-func_01 li:nth-of-type(8) a div,
#weeks.a09 #nav-func_01 li:nth-of-type(9) a div,
#weeks.a10 #nav-func_01 li:nth-of-type(10) a div
{
  background-color: #1FCCC9;
}

#nav-func_01 li a div span
{
  display: inline-block;
  font-size: 14px;
  line-height: 1.1;
  vertical-align: middle;
}

.a01 #nav-func_01 li:nth-of-type(1) a div span,
.a02 #nav-func_01 li:nth-of-type(2) a div span,
.a03 #nav-func_01 li:nth-of-type(3) a div span,
.a04 #nav-func_01 li:nth-of-type(4) a div span,
.a05 #nav-func_01 li:nth-of-type(5) a div span,
.a06 #nav-func_01 li:nth-of-type(6) a div span,
.a07 #nav-func_01 li:nth-of-type(7) a div span,
.a08 #nav-func_01 li:nth-of-type(8) a div span,
.a09 #nav-func_01 li:nth-of-type(9) a div span,
.a10 #nav-func_01 li:nth-of-type(10) a div span
{
  color: #FFF;
}


/* --------------------------------------------------------- */


#nav-func_02
{
  width: 96em;
  margin: 0 auto 8em auto;
}

#nav-func_02 li
{
  box-sizing: border-box;
  display: inline-block;
  border-left: 1px solid #404040;
  vertical-align: top;
}

#planner #nav-func_02 li:nth-of-type(1)
{
  width: 8.8em;
}

#planner #nav-func_02 li:nth-of-type(2)
{
  width: 8.5em;
}

#planner #nav-func_02 li:nth-of-type(3)
{
  width: 13.3em;
}

#planner #nav-func_02 li:nth-of-type(4)
{
  width: 14.1em;
}

#planner #nav-func_02 li:nth-of-type(5)
{
  width: 10.5em;
}

#planner #nav-func_02 li:nth-of-type(6)
{
  width: 10.9em;
}

#planner #nav-func_02 li:nth-of-type(7)
{
  width: 10.5em;
}

#planner #nav-func_02 li:nth-of-type(8)
{
  width: 11.3em;
}

#planner #nav-func_02 li:nth-of-type(9)
{
  width: 8.1em;
}

#original #nav-func_02 li:nth-of-type(1),
#cousin #nav-func_02 li:nth-of-type(1),
#weeks #nav-func_02 li:nth-of-type(1)
{
  width: 8.1em;
}

#original #nav-func_02 li:nth-of-type(2),
#cousin #nav-func_02 li:nth-of-type(2),
#weeks #nav-func_02 li:nth-of-type(2)
{
  width: 7.8em;
}

#original #nav-func_02 li:nth-of-type(3),
#cousin #nav-func_02 li:nth-of-type(3),
#weeks #nav-func_02 li:nth-of-type(3)
{
  width: 12.6em;
}

#original #nav-func_02 li:nth-of-type(4),
#cousin #nav-func_02 li:nth-of-type(4),
#weeks #nav-func_02 li:nth-of-type(4)
{
  width: 13.5em;
}

#original #nav-func_02 li:nth-of-type(5),
#cousin #nav-func_02 li:nth-of-type(5),
#weeks #nav-func_02 li:nth-of-type(5)
{
  width: 9.8em;
}

#original #nav-func_02 li:nth-of-type(6),
#cousin #nav-func_02 li:nth-of-type(6),
#weeks #nav-func_02 li:nth-of-type(6)
{
  width: 10.2em;
}

#original #nav-func_02 li:nth-of-type(7),
#cousin #nav-func_02 li:nth-of-type(7),
#weeks #nav-func_02 li:nth-of-type(7)
{
  width: 6.1em;
}

#original #nav-func_02 li:nth-of-type(8),
#cousin #nav-func_02 li:nth-of-type(8),
#weeks #nav-func_02 li:nth-of-type(8)
{
  width: 9.9em;
}

#original #nav-func_02 li:nth-of-type(9),
#cousin #nav-func_02 li:nth-of-type(9),
#weeks #nav-func_02 li:nth-of-type(9)
{
  width: 10.6em;
}

#original #nav-func_02 li:nth-of-type(10),
#cousin #nav-func_02 li:nth-of-type(10),
#weeks #nav-func_02 li:nth-of-type(10)
{
  width: 7.4em;
}

#nav-func_02 li:last-child
{
  border-right: 1px solid #404040;
}

#nav-func_02 li a
{
  box-sizing: border-box;
  display: block;
  height: 4em;
  padding: .1em 0 0 0;
  color: #404040;
  text-align: center;
}

#nav-func_02 li a:after
{
  content: "";
  display: inline-block;
  height: 4em;
  vertical-align: middle;
}

#nav-func_02 li a span
{
  display: inline-block;
  font-size: 14px;
  line-height: 1.071;
  vertical-align: middle;
}


/* --------------------------------------------------------- */


#img-main
{
  position: relative;
  width: 96em;
  height: 35em;
  margin: 0 auto 2em auto;
  text-align: left;
  z-index: 1;
}

#img-main > img
{
  position: absolute;
}

#img-main > div
{
  position: absolute;
}

#img-main > div h3
{
  margin-bottom: 1.5em;
  color: #404040;
}

#img-main > div h3 small
{
  font-size: 18px;
  line-height: 1.6;
}

#img-main > div h3 span
{
  font-size: 48px;
  line-height: 1.208;
}

#img-main > div p span
{
  font-family: "Times New Roman", Georgia, serif;
  font-size: 17px;
  line-height: 1.588;
}

#img-main > a.mdi-chevron-right
{
  display: block;
  position: absolute;
  bottom: 18px;
  right: 19px;
  width: 19.2em;
  height: 2.8em;
  padding-top: .1em;
  background-color: #404040;
  color: #FFF;
  text-align: center;
}

#img-main > a.mdi-chevron-right:before
{
  position: absolute;
  top: 50%;
  right: 2px;
  margin-top: -.51em;
  font-size: 17px;
  font-size: 19px;
  line-height: 1;
}

#img-main > a.mdi-chevron-right:after
{
  content: "";
  display: inline-block;
  height: 2.8em;
  vertical-align: middle;
}

#img-main > a.mdi-chevron-right span
{
  font-size: 19px;
  line-height: 1;
  vertical-align: middle;
}


/* --------------------------------------------------------- */


#nav-page_01,
#nav-page_02
{
  width: 96em;
  text-align: left;
}

#nav-page_01:after,
#nav-page_02:after
{
  content: "";
  display: block;
  clear: both;
}

#nav-page_01
{
  margin: 0 auto 4em auto;
}

#nav-page_02
{
  margin: 0 auto 4.5em auto;
}

#nav-page_01 li:nth-of-type(1),
#nav-page_02 li:nth-of-type(1)
{
  float: left;
}

#nav-page_01 li:nth-of-type(2),
#nav-page_02 li:nth-of-type(2)
{
  float: right;
}

.a01 #nav-page_01 li:nth-child(1),
.a01 #nav-page_02 li:nth-child(1)
{
  display: none;
}

#planner.a09 #nav-page_01 li:nth-child(2),
#planner.a09 #nav-page_02 li:nth-child(2),
#original.a10 #nav-page_01 li:nth-child(2),
#original.a10 #nav-page_02 li:nth-child(2),
#cousin.a10 #nav-page_01 li:nth-child(2),
#cousin.a10 #nav-page_02 li:nth-child(2),
#weeks.a10 #nav-page_01 li:nth-child(2),
#weeks.a10 #nav-page_02 li:nth-child(2)
{
  display: none;
}

#nav-page_01 li a,
#nav-page_02 li a
{
  display: inline-block;
  position: relative;
  height: 2.6em;
}

#planner #nav-page_01 li a,
#planner #nav-page_02 li a
{
  color: #A53E5C;
}

#original #nav-page_01 li a,
#original #nav-page_02 li a
{
  color: #5C2849;
}

#cousin #nav-page_01 li a,
#cousin #nav-page_02 li a
{
  color: #EA4863;
}

#weeks #nav-page_01 li a,
#weeks #nav-page_02 li a
{
  color: #1FCCC9;
}

#nav-page_01 li a:before,
#nav-page_02 li a:before
{
  position: absolute;
  display: block;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  font-size: 19px;
  line-height: 1.3;
  text-align: center;
}

#planner #nav-page_01 li a:before,
#planner #nav-page_02 li a:before
{
  border: 1px solid #A53E5C;
}

#original #nav-page_01 li a:before,
#original #nav-page_02 li a:before
{
  border: 1px solid #5C2849;
}

#cousin #nav-page_01 li a:before,
#cousin #nav-page_02 li a:before
{
  border: 1px solid #EA4863;
}

#weeks #nav-page_01 li a:before,
#weeks #nav-page_02 li a:before
{
  border: 1px solid #1FCCC9;
}

#nav-page_01 li a:after,
#nav-page_02 li a:after
{
  content: "";
  display: inline-block;
  height: 2.6em;
  vertical-align: middle;
}

#nav-page_01 li:nth-of-type(1) a,
#nav-page_02 li:nth-of-type(1) a
{
  padding-left: 2.2em;
}

#nav-page_01 li:nth-of-type(1) a:before,
#nav-page_02 li:nth-of-type(1) a:before
{
  top: 0;
  left: 0;
}

#nav-page_01 li:nth-of-type(2) a,
#nav-page_02 li:nth-of-type(2) a
{
  padding-right: 2.2em;
}

#nav-page_01 li:nth-of-type(2) a:before,
#nav-page_02 li:nth-of-type(2) a:before
{
  top: 0;
  right: 0;
}

#nav-page_01 li a div,
#nav-page_02 li a div
{
  display: inline-block;
  padding: .2em 1em 0 1em;
  vertical-align: middle;
}

#planner #nav-page_01 li a div:nth-of-type(2),
#planner #nav-page_02 li a div:nth-of-type(2)
{
  border-left: 1px solid #A53E5C;
}

#original #nav-page_01 li a div:nth-of-type(2),
#original #nav-page_02 li a div:nth-of-type(2)
{
  border-left: 1px solid #5C2849;
}

#cousin #nav-page_01 li a div:nth-of-type(2),
#cousin #nav-page_02 li a div:nth-of-type(2)
{
  border-left: 1px solid #EA4863;
}

#weeks #nav-page_01 li a div:nth-of-type(2),
#weeks #nav-page_02 li a div:nth-of-type(2)
{
  border-left: 1px solid #1FCCC9;
}

#nav-page_01 li a div span,
#nav-page_02 li a div span
{
  font-size: 15px;
  line-height: 1;
}

#nav-page_01 li:nth-of-type(1) a div:nth-of-type(1) span:before,
#nav-page_02 li:nth-of-type(1) a div:nth-of-type(1) span:before
{
  content: "BACK";
}

#nav-page_01 li:nth-of-type(2) a div:nth-of-type(2) span:before,
#nav-page_02 li:nth-of-type(2) a div:nth-of-type(2) span:before
{
  content: "NEXT";
}

/* --------------------------------------------------------- */


#nav-page_01 + div.txt_01
{
  width: 96em;
  margin: 0 auto 1em auto;
  text-align: right;
}

#nav-page_01 + div.txt_01 div
{
  display: inline-block;
  height: 2.2em;
  padding: .1em 0 0 2.3em;
  background-image: url(/store/techo/pc/en/2017/all_about/images/ico_loupe.svg);
  background-repeat: no-repeat;
  background-size: 2.2em 2.2em;
}


#nav-page_01 + div.txt_01 div span
{
  color: #333;
  font-size: 13px;
  height: 1;
}

#nav-page_01 + div.txt_01 div span:before
{
  content: "...";
}


/* --------------------------------------------------------- */


.formatA main section h4,
.formatB main section h4
{
  position: relative;
  margin: 0 0 2em 0;
  padding: 0 0 0 1.5em;
}

#planner.formatA main section h4,
#planner.formatB main section h4
{
  border-bottom: 2px solid #A53E5C;
  border-left: 35px solid #A53E5C;
  color: #A53E5C;
}

#original.formatA main section h4,
#original.formatB main section h4
{
  border-bottom: 2px solid #5C2849;
  border-left: 35px solid #5C2849;
  color: #5C2849;
}

#cousin.formatA main section h4,
#cousin.formatB main section h4
{
  border-bottom: 2px solid #EA4863;
  border-left: 35px solid #EA4863;
  color: #EA4863;
}

#weeks.formatA main section h4,
#weeks.formatB main section h4
{
  border-bottom: 2px solid #1FCCC9;
  border-left: 35px solid #1FCCC9;
  color: #1FCCC9;
}

.formatA main section h4:before,
.formatB main section h4:before
{
  display: block;
  box-sizing: border-box;
  position: absolute;
  top: 0;
  left: -35px;
  width: 35px;
  height: 33px;
  color: #FFF;
  font-size: 25px;
  line-height: 1.5;
  text-align: center;
}

.formatA main section.section_01 h4:before,
.formatB main section.section_01 h4:before
{
  content: "1";
}

.formatA main section.section_02 h4:before,
.formatB main section.section_02 h4:before
{
  content: "2";
}

.formatA main section.section_03 h4:before,
.formatB main section.section_03 h4:before
{
  content: "3";
}

.formatA main section.section_04 h4:before,
.formatB main section.section_04 h4:before
{
  content: "4";
}

.formatA main section.section_05 h4:before,
.formatB main section.section_05 h4:before
{
  content: "5";
}

.formatA main section.section_06 h4:before,
.formatB main section.section_06 h4:before
{
  content: "6";
}

.formatA main section.section_07 h4:before,
.formatB main section.section_07 h4:before
{
  content: "7";
}

.formatA main section.section_08 h4:before,
.formatB main section.section_08 h4:before
{
  content: "8";
}

.formatA main section.section_09 h4:before,
.formatB main section.section_09 h4:before
{
  content: "9";
}

.formatA main section.section_10 h4:before,
.formatB main section.section_10 h4:before
{
  content: "10";
}

.formatA main section.section_11 h4:before,
.formatB main section.section_11 h4:before
{
  content: "11";
}

.formatA main section.section_12 h4:before,
.formatB main section.section_12 h4:before
{
  content: "12";
}

.formatA main section.section_13 h4:before,
.formatB main section.section_13 h4:before
{
  content: "13";
}

.formatA main section.section_14 h4:before,
.formatB main section.section_14 h4:before
{
  content: "14";
}

.formatA main section.section_15 h4:before,
.formatB main section.section_15 h4:before
{
  content: "15";
}

.formatA main section.section_16 h4:before,
.formatB main section.section_16 h4:before
{
  content: "16";
}

.formatA main section.section_17 h4:before,
.formatB main section.section_17 h4:before
{
  content: "17";
}

.formatA main section.section_18 h4:before,
.formatB main section.section_18 h4:before
{
  content: "18";
}

.formatA main section.section_19 h4:before,
.formatB main section.section_19 h4:before
{
  content: "19";
}

.formatA main section.section_20 h4:before,
.formatB main section.section_20 h4:before
{
  content: "20";
}

.formatA main section
{
  width: 96em;
  margin: 0 auto 4em auto;
}

.formatA main section:after
{
  content: "";
  display: block;
  clear: both;
}

.formatA main section > div
{
  float: left;
  width: 52em;
  text-align: left;
}

.formatA main section > div h4.tit_01 span
{
  display: inline-block;
  margin-bottom: -.1em;
  font-size: 25px;
  line-height: 1.5;
}

.formatA main section > div p
{
  margin-bottom: 1.176em;
  padding-right: 2.352em;
  font-family: "Times New Roman", Georgia, serif;
  font-size: 17px;
  line-height: 1.588;
}

.formatA main section > a.ico-loupe
{
  float: right;
  width: 44em;
}

.formatB main div.container_01
{
  width: 96em;
  margin: 0 auto 6em auto;
}

.formatB main div.container_01:after
{
  content: "";
  display: block;
  clear: both;
}

.formatB main div.container_01 section
{
  width: 44em;
  text-align: left;
}

.formatB main div.container_01 section:nth-of-type(1)
{
  float: left;
}

.formatB main div.container_01 section:nth-of-type(2)
{
  float: right;
}

.formatB main div.container_01 section h4 span
{
  display: inline-block;
  margin-bottom: -.1em;
  font-size: 25px;
  line-height: 1.5;
}

/* ------------------------------------------------------------

  .modal

------------------------------------------------------------ */

#index .modal,
#planner .modal,
#original .modal,
#cousin .modal,
#weeks .modal
{
  font-size: 10px;
  display: inline-block;
  padding: 1em 1em 5em 1em;
  text-align: center;
}

#index .modal img,
#planner .modal img,
#original .modal img,
#cousin .modal img,
#weeks .modal img,
{
  display: block;
  max-width: 80em;
}

#index .modal a,
#planner .modal a,
#original .modal a,
#cousin .modal a,
#weeks .modal a
{
  display: inline-block;
  position: absolute;
  top: auto;
  bottom: 2.1em;
  right: 2em;
  width: auto;
  height: 1.7em;
  padding-right: 2.4em;
  color: #808080;
  background: none;
}

#index .modal a:before,
#planner .modal a:before,
#original .modal a:before,
#cousin .modal a:before,
#weeks .modal a:before
{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: auto;
  right: 0;
  width: 1.7em;
  height: 1.7em;
  margin: 0;
  padding-top: .15em;
  background-image: url(/store/techo/pc/en/2017/all_about/images/ico_close.svg);
  background-repeat: no-repeat;
  background-size: 1.7em 1.7em;
  font-size: 10px;
}

#index .modal a span,
#planner .modal a span,
#original .modal a span,
#cousin .modal a span,
#weeks .modal a span
{
  font-size: 13px;
  line-height: 1.307;
}