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

	FileName	:	simulation.css
	Generator	:	Sass

-------------------------------------------- */
#printLogo,
.printTtl {
  display: none; }

#simulation {
  position: relative;
  overflow: hidden; }

#container {
  width: 960px;
  margin: 0 auto;
  padding: 0 0 60px;
  position: relative;
  z-index: 5; }
  #container .detail {
    width: 396px;
    height: 15px;
    margin: 0 auto; }
    #container .detail a {
      width: 396px;
      height: 15px;
      background: url("../img/simulation/sprite.png") no-repeat 0 -332px; }
      #container .detail a:hover {
        background-position: 0 -348px; }

#simulationWrap {
  position: relative;
  min-height: 500px; }
  #simulationWrap .hide {
    display: none; }

#point {
  display: none;
  position: absolute;
  top: 130px;
  left: 50%;
  width: 960px;
  height: 134px;
  margin: 0 0 0 -480px;
  font-size: 91.66667%;
  z-index: 1; }
  #point .inner {
    float: left;
    text-align: center;
    width: 133px;
    height: 88px;
    margin: 0 0 0 -165px;
    padding: 48px 32px 0 0;
    white-space: nowrap;
    color: #fff;
    background: url("../img/simulation/bg_balloon.gif") no-repeat left top; }

.slideContent {
  padding: 70px 0 50px; }
  .slideContent > .header {
    position: relative;
    margin: 0 0 -30px;
    z-index: 10; }
    .slideContent > .header p {
      margin: 0 auto; }
    .slideContent > .header ol {
      position: absolute;
      top: -8px;
      right: 0;
      width: 250px;
      height: 66px;
      margin: 0; }
      .slideContent > .header ol li {
        float: left;
        width: 55px;
        height: 41px;
        margin: 13px 5px 0 0;
        background-image: url("../img/simulation/sprite.png");
        background-repeat: no-repeat; }
        .slideContent > .header ol li.flow1 {
          background-position: -230px -377px; }
        .slideContent > .header ol li.flow2 {
          background-position: -290px -377px; }
        .slideContent > .header ol li.flow3 {
          background-position: -350px -377px; }
        .slideContent > .header ol li.flow4 {
          width: 66px;
          height: 66px;
          margin: 0;
          background-position: -413px -364px; }
  .slideContent > .section {
    position: relative;
    z-index: 15; }
    .slideContent > .section > .header {
      position: relative;
      height: 18px;
      margin: 0 auto 20px; }
      .slideContent > .section > .header h2 {
        float: left;
        height: 15px;
        margin: 3px 0 0;
        background-image: url("../img/simulation/sprite.png");
        background-repeat: no-repeat; }
      .slideContent > .section > .header p {
        float: right;
        height: 18px;
        background-image: url("../img/simulation/sprite.png");
        background-repeat: no-repeat; }
      .slideContent > .section > .header .balloon {
        position: absolute;
        top: -80px;
        right: -105px;
        width: 100px;
        height: 99px; }
        .slideContent > .section > .header .balloon .inner {
          width: 100px;
          height: 99px;
          background-image: url("../img/simulation/sprite.png");
          background-repeat: no-repeat; }
  .slideContent ul.buttons {
    margin: 0 -15px 60px 0; }
    .slideContent ul.buttons li {
      float: left;
      width: 310px;
      height: 70px;
      margin: 0 15px 15px 0; }
      .slideContent ul.buttons li a {
        display: block;
        height: 48px;
        line-height: 48px;
        padding: 10px 15px;
        color: #b2a34e;
        border: 1px dotted #b2a34e;
        text-align: center;
        text-decoration: none;
        vertical-align: middle;
        outline: 0; }
        .slideContent ul.buttons li a:hover {
          height: 46px;
          line-height: 46px;
          border: 2px solid #b2a34e; }
        .slideContent ul.buttons li a span {
          display: inline-block;
          vertical-align: middle; }
        .slideContent ul.buttons li a .keyword1,
        .slideContent ul.buttons li a .keyword2,
        .slideContent ul.buttons li a .keyword3 {
          line-height: 1.4;
          text-align: left; }
        .slideContent ul.buttons li a .title {
          margin: 0 auto;
          font-size: 125%;
          font-weight: bold;
          line-height: 1.2; }
        .slideContent ul.buttons li a:hover .keyword1,
        .slideContent ul.buttons li a:hover .keyword2,
        .slideContent ul.buttons li a:hover .keyword3 {
          display: none !important; }
        .slideContent ul.buttons li a:hover .title {
          display: inline-block !important; }
        .slideContent ul.buttons li a.checked {
          height: 46px;
          line-height: 46px;
          border: 2px solid #b2a34e;
          background: #b2a34e;
          color: #fff; }
        .slideContent ul.buttons li a.limit, .slideContent ul.buttons li a.cantSelect {
          cursor: default;
          border-color: #bfbfbf;
          color: #aaa; }
        .slideContent ul.buttons li a.disable {
          cursor: default;
          height: 46px;
          line-height: 46px;
          border: 2px solid #f1957e;
          background: #f1957e;
          color: #fff; }
  .slideContent .button {
    width: 480px;
    margin: 0 auto; }
    .slideContent .button .prev,
    .slideContent .button .next {
      width: 230px;
      height: 36px; }
      .slideContent .button .prev a,
      .slideContent .button .next a {
        width: 230px;
        height: 36px; }
    .slideContent .button .prev {
      float: left; }
    .slideContent .button .next {
      float: right; }

#start h2 {
  margin: 0 auto -35px;
  width: 645px;
  height: 203px;
  background: url("../img/simulation/sprite_heading.gif") no-repeat 0 0; }
#start p {
  margin: 0 auto 65px;
  width: 542px;
  height: 86px;
  background: url("../img/simulation/sprite.png") no-repeat 0 0; }
#start .caution {
  width: 700px;
  height: 100px;
  margin: 0 auto 65px;
  background: url("../img/simulation/txt_caution.gif") no-repeat 0 0; }
#start .next {
  width: 230px;
  height: 36px;
  margin: 0 auto 65px; }
  #start .next a {
    width: 230px;
    height: 36px;
    background: url("../img/simulation/sprite.png") no-repeat 0 -364px; }

#browser {
  width: 700px;
  height: 209px;
  margin: 0 auto;
  background: url("../img/simulation/browser.png") no-repeat left top; }

#header1 {
  width: 119px; }
  #header1 h2 {
    width: 109px;
    background-position: 0 -90px; }
  #header1 p {
    width: 0;
    background-position: 0 -207px; }
  #header1 .balloon .inner {
    background-position: 0 -551px; }

#header2 {
  width: 347px; }
  #header2 h2 {
    width: 73px;
    background-position: 0 -107px; }
  #header2 p {
    width: 264px;
    background-position: 0 -233px; }
  #header2 .balloon .inner {
    background-position: 0 -551px; }

#header3 {
  width: 243px; }
  #header3 h2 {
    width: 82px;
    background-position: 0 -141px; }
  #header3 p {
    width: 151px;
    background-position: 0 -259px; }
  #header3 .balloon .inner {
    background-position: -200px -551px; }

#header4 {
  width: 396px; }
  #header4 h2 {
    width: 122px;
    background-position: 0 -158px; }
  #header4 p {
    width: 264px;
    background-position: 0 -285px; }
  #header4 .balloon .inner {
    background-position: -300px -551px; }

#header5 {
  width: 356px; }
  #header5 h2 {
    width: 163px;
    background-position: 0 -175px; }
  #header5 p {
    width: 183px;
    background-position: 0 -311px; }
  #header5 .balloon .inner {
    background-position: -400px -551px; }

#header6 {
  width: 349px; }
  #header6 h2 {
    width: 156px;
    background-position: 0 -192px; }
  #header6 p {
    width: 183px;
    background-position: 0 -311px; }
  #header6 .balloon .inner {
    background-position: -400px -551px; }

#section1 > .header p {
  width: 577px;
  height: 203px;
  background: url("../img/simulation/sprite_heading.gif") no-repeat 0 -859px; }
#section1 > .header ol li.flow1 {
  background-position: -230px -443px; }
#section1 .caution {
  margin: 0 0 20px; }
  #section1 .caution .inner {
    float: right;
    width: 396px;
    height: 18px;
    background: url("../img/simulation/sprite.png") no-repeat 0 -806px; }
#section1 .next {
  width: 230px;
  height: 36px;
  margin: 0 auto; }
  #section1 .next a {
    width: 230px;
    height: 36px;
    background: url("../img/simulation/sprite.png") no-repeat 0 -400px; }

#section2 {
  min-height: 500px; }
  #section2 > .header p {
    width: 570px;
    height: 203px;
    background: url("../img/simulation/sprite_heading.gif") no-repeat 0 -430px; }
  #section2 > .header ol li.flow2 {
    background-position: -290px -443px; }
  #section2 .courseSelect {
    margin: 0 -20px 60px 0; }
    #section2 .courseSelect li {
      float: left;
      width: 225px;
      margin: 0 20px 0 0; }
      #section2 .courseSelect li a {
        display: block;
        height: 48px;
        line-height: 48px;
        padding: 10px;
        color: #b2a34e;
        white-space: nowrap;
        border: 1px dotted #b2a34e;
        text-align: center;
        outline: 0;
        font-size: 116.66667%;
        font-weight: bold;
        text-decoration: none; }
        #section2 .courseSelect li a:hover {
          height: 46px;
          line-height: 46px;
          border: 2px solid #b2a34e; }
        #section2 .courseSelect li a.selected {
          height: 46px;
          line-height: 46px;
          border: 2px solid #b2a34e; }
      #section2 .courseSelect li.navCourse1 a {
        color: #67b5cf;
        border-color: #67b5cf; }
        #section2 .courseSelect li.navCourse1 a.selected {
          color: #fff;
          background: #67b5cf; }
      #section2 .courseSelect li.navCourse2 a {
        color: #67cf93;
        border-color: #67cf93; }
        #section2 .courseSelect li.navCourse2 a.selected {
          color: #fff;
          background: #67cf93; }
      #section2 .courseSelect li.navCourse3 a {
        color: #e9944e;
        border-color: #e9944e; }
        #section2 .courseSelect li.navCourse3 a.selected {
          color: #fff;
          background: #e9944e; }
      #section2 .courseSelect li.navCourse4 a {
        color: #df7395;
        border-color: #df7395; }
        #section2 .courseSelect li.navCourse4 a.selected {
          color: #fff;
          background: #df7395; }
  #section2 .prev a {
    background: url("../img/simulation/sprite.png") no-repeat 0 -436px; }
  #section2 .next a {
    background: url("../img/simulation/sprite.png") no-repeat 0 -400px; }

#courseHeader {
  margin: 0 0 60px; }
  #courseHeader h2 {
    width: 98px;
    height: 15px;
    margin: 0 auto;
    background: url("../img/simulation/sprite.png") no-repeat 0 -124px; }
  #courseHeader .balloon {
    position: absolute;
    top: -85px;
    left: 50%;
    width: 100px;
    height: 99px;
    margin-left: 54px; }
    #courseHeader .balloon .inner {
      width: 100px;
      height: 99px;
      background: url("../img/simulation/sprite.png") no-repeat -100px -551px; }

#section3 > .header p {
  width: 379px;
  height: 203px;
  background: url("../img/simulation/sprite_heading.gif") no-repeat 0 -215px; }
#section3 > .header ol li.flow3 {
  background-position: -350px -443px; }
#section3 #header4 {
  margin: 0 auto 20px; }
#section3 .caution {
  margin: 0 0 20px; }
  #section3 .caution .inner {
    float: right;
    width: 396px;
    height: 18px;
    background: url("../img/simulation/sprite.png") no-repeat 0 -806px; }
#section3 .course h3 {
  width: 320px;
  height: 36px;
  margin: 0 auto 40px;
  background-image: url("../img/simulation/sprite.png");
  background-repeat: no-repeat; }
#section3 .section .header {
  margin: 0 auto 40px; }
#section3 .prev a {
  background: url("../img/simulation/sprite.png") no-repeat 0 -436px; }
#section3 .next a {
  background: url("../img/simulation/sprite.png") no-repeat 0 -472px; }
#section3 .point .balloon {
  padding: 0 0 40px; }
  #section3 .point .balloon .inner {
    text-align: center;
    color: #dd6446;
    padding: 10px;
    border: 1px solid #dd6446; }

#course1 .buttons li a {
  color: #67b5cf;
  border-color: #67b5cf; }
  #course1 .buttons li a.checked {
    color: #fff;
    background: #67b5cf; }
  #course1 .buttons li a.limit, #course1 .buttons li a.cantSelect {
    cursor: default;
    border-color: #bfbfbf;
    color: #aaa; }

#course2 .buttons li a {
  color: #67cf93;
  border-color: #67cf93; }
  #course2 .buttons li a.checked {
    color: #fff;
    background: #67cf93; }
  #course2 .buttons li a.limit, #course2 .buttons li a.cantSelect {
    cursor: default;
    border-color: #bfbfbf;
    color: #aaa; }

#course3 .buttons li a {
  color: #e9944e;
  border-color: #e9944e; }
  #course3 .buttons li a.checked {
    color: #fff;
    background: #e9944e; }
  #course3 .buttons li a.limit, #course3 .buttons li a.cantSelect {
    cursor: default;
    border-color: #bfbfbf;
    color: #aaa; }

#course4 .buttons li a {
  color: #df7395;
  border-color: #df7395; }
  #course4 .buttons li a.checked {
    color: #fff;
    background: #df7395; }
  #course4 .buttons li a.limit, #course4 .buttons li a.cantSelect {
    cursor: default;
    border-color: #bfbfbf;
    color: #aaa; }

#sectionResult {
  padding: 70px 0 50px; }
  #sectionResult > .header {
    position: relative;
    z-index: 10;
    margin: 0 0 20px; }
    #sectionResult > .header p {
      text-align: center;
      margin: 0; }
      #sectionResult > .header p img.print {
        display: none; }
    #sectionResult > .header ol {
      position: absolute;
      top: -8px;
      right: 0;
      width: 250px;
      height: 66px;
      margin: 0; }
      #sectionResult > .header ol li {
        float: left;
        width: 55px;
        height: 41px;
        margin: 13px 5px 0 0;
        background-image: url("../img/simulation/sprite.png");
        background-repeat: no-repeat; }
        #sectionResult > .header ol li.flow1 {
          background-position: -230px -377px; }
        #sectionResult > .header ol li.flow2 {
          background-position: -290px -377px; }
        #sectionResult > .header ol li.flow3 {
          background-position: -350px -377px; }
        #sectionResult > .header ol li.flow4 {
          width: 66px;
          height: 66px;
          margin: 0;
          background-position: -413px -430px; }
  #sectionResult > .section {
    margin: 0 0 60px; }
  #sectionResult .box {
    margin: 0 0 25px;
    padding: 15px;
    text-align: center;
    line-height: 1.6;
    border: 1px solid #b2a34e; }
    #sectionResult .box em {
      color: #df6340; }
  #sectionResult .button {
    width: 480px;
    margin: 0 auto; }
    #sectionResult .button .return {
      float: left;
      width: 230px;
      height: 36px; }
      #sectionResult .button .return a {
        width: 230px;
        height: 36px;
        background: url("../img/simulation/sprite.png") no-repeat -240px -508px; }
    #sectionResult .button .print {
      float: right;
      width: 230px;
      height: 36px; }
      #sectionResult .button .print a {
        width: 230px;
        height: 36px;
        background: url("../img/simulation/sprite.png") no-repeat 0 -508px; }

#rateIn {
  position: relative;
  z-index: 15;
  margin: 0 auto 40px; }
  #rateIn th {
    width: 270px;
    padding: 10px 0;
    text-align: right; }
  #rateIn td {
    padding: 10px 0; }
    #rateIn td.image {
      width: 80px;
      text-align: center; }

#selected p {
  text-align: center;
  margin: 0 0 40px; }
#selected .section {
  margin: 0 0 40px; }
  #selected .section h2 {
    height: 15px;
    margin: 0 auto 5px; }
  #selected .section p {
    text-align: center;
    margin: 0 0 20px; }
#selected table {
  width: 100%;
  table-layout: fixed; }
  #selected table td {
    padding: 5px; }
    #selected table td .inner {
      display: block;
      height: 48px;
      line-height: 48px;
      padding: 10px;
      color: #b2a34e;
      white-space: nowrap;
      border: 1px solid #b2a34e;
      text-align: center;
      font-size: 116.66667%; }

.result1 h2 {
  width: 109px;
  background: url("../img/simulation/sprite.png") no-repeat 0 -90px; }

.result2 h2 {
  width: 73px;
  background: url("../img/simulation/sprite.png") no-repeat 0 -107px; }

.result3 h2 {
  width: 82px;
  background: url("../img/simulation/sprite.png") no-repeat 0 -141px; }

.result4 h2 {
  width: 122px;
  background: url("../img/simulation/sprite.png") no-repeat 0 -158px; }

.result5 h2 {
  width: 163px;
  background: url("../img/simulation/sprite.png") no-repeat 0 -175px; }

.result6 h2 {
  width: 156px;
  background: url("../img/simulation/sprite.png") no-repeat 0 -192px; }

#course1 h3 {
  background-position: 0 -652px; }

#course2 h3 {
  background-position: 0 -688px; }

#course3 h3 {
  background-position: 0 -724px; }

#course4 h3 {
  background-position: 0 -760px; }

#section1,
#section2,
#section3,
#sectionResult {
  position: absolute;
  top: -9999px;
  left: -9999px;
  width: 960px; }

#loading {
  display: none;
  position: relative;
  width: 960px;
  height: 500px; }
  #loading img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -24px 0 0 -24px; }

#detail {
  width: 740px;
  margin: 0 auto;
  padding: 70px 0 60px; }
  #detail p.lead {
    text-align: center;
    margin: 0 0 40px; }
  #detail > .figure {
    margin: 0 0 60px; }
  #detail .section {
    margin: 0 0 60px; }
    #detail .section h2 {
      margin: 0 0 20px; }
    #detail .section ul li {
      margin: 0 0 35px; }
      #detail .section ul li dl dt {
        margin: 0 0 8px; }
      #detail .section ul li dl dd {
        padding: 0 0 0 15px; }
        #detail .section ul li dl dd a {
          display: inline-block;
          text-indent: 100%;
          white-space: nowrap;
          overflow: hidden; }
        #detail .section ul li dl dd p {
          margin: 0 0 17px; }
      #detail .section ul li.list1 a {
        width: 115px;
        height: 15px;
        background: url("../img/simulation/sprite_detail1.gif") no-repeat 0 -15px; }
        #detail .section ul li.list1 a:hover {
          background-position: 0 0; }
      #detail .section ul li.list3 a {
        width: 124px;
        height: 15px;
        background: url("../img/simulation/sprite_detail2.gif") no-repeat 0 -15px;
        float: left;
        margin: 0 10px 0 0; }
        #detail .section ul li.list3 a:hover {
          background-position: 0 0; }
      #detail .section ul li.list3 .left {
        float: left; }
      #detail .section ul li.list3 .clearling {
        clear: both; }
  #detail .btn {
    text-align: center; }

#container .detail a, .slideContent > .header p, .slideContent > .header ol li, .slideContent > .section > .header h2, .slideContent > .section > .header p, .slideContent > .section > .header .balloon .inner, .slideContent .button .prev a,
.slideContent .button .next a, #start h2, #start p, #start .caution, #start .next a, #browser, #section1 .caution .inner, #section1 .next a, #courseHeader h2, #courseHeader .balloon .inner, #section3 .caution .inner, #section3 .course h3, #sectionResult > .header ol li, #sectionResult .button .return a, #sectionResult .button .print a, #selected .section h2 {
  display: block;
  text-indent: 150%;
  white-space: nowrap;
  overflow: hidden; }

#simulationWrap, .slideContent > .header ol, .slideContent > .section > .header, .slideContent ul.buttons, .slideContent .button, #section1 .caution, #section2 .courseSelect, #section3 .caution, #sectionResult > .header ol, #sectionResult .button {
  display: inline-block; }
  #simulationWrap, .slideContent > .header ol, .slideContent > .section > .header, .slideContent ul.buttons, .slideContent .button, #section1 .caution, #section2 .courseSelect, #section3 .caution, #sectionResult > .header ol, #sectionResult .button {
    display: block; }
  #simulationWrap:after, .slideContent > .header ol:after, .slideContent > .section > .header:after, .slideContent ul.buttons:after, .slideContent .button:after, #section1 .caution:after, #section2 .courseSelect:after, #section3 .caution:after, #sectionResult > .header ol:after, #sectionResult .button:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
    visibility: hidden; }

@media print {
  html #header {
    width: 100%;
    height: auto;
    padding: 0 0 20px; }
    html #header #printLogo {
      text-align: center;
      display: block; }
    html #header h1,
    html #header ul {
      display: none; }
  html #container {
    width: 100%;
    margin: 0 !important; }
  html #simulation h1 {
    height: 25px;
    padding: 20px; }
    html #simulation h1 .inner {
      display: none; }
    html #simulation h1 .printTtl {
      display: block; }
  html #start,
  html #section1,
  html #section2,
  html #section3 {
    display: none !important; }
  html #simulationWrap {
    min-height: 0; }
  html #sectionResult {
    width: 100%;
    padding: 20px 0 0; }
    html #sectionResult > .header ol {
      display: none; }
    html #sectionResult > .header p img {
      display: none; }
      html #sectionResult > .header p img.print {
        display: inline-block; }
    html #sectionResult #rateIn th,
    html #sectionResult #rateIn td {
      padding-top: 0; }
    html #sectionResult #rateIn .box {
      margin: 0 0 20px; }
    html #sectionResult .button {
      display: none; }
  html #selected {
    margin: 0 !important; }
    html #selected p {
      font-family: serif;
      margin: 0 0 20px; }
    html #selected .section {
      margin: 0 0 20px; }
      html #selected .section h2 {
        text-align: center;
        width: 100%;
        height: auto;
        margin-bottom: 5px;
        text-indent: 0;
        overflow: auto;
        font-family: serif;
        background: none; }
      html #selected .section p {
        margin: 0 0 5px; }
    html #selected table {
      table-layout: fixed; }
      html #selected table td {
        padding: 5px; }
        html #selected table td .inner {
          font-size: 12px;
          white-space: normal;
          vertical-align: middle;
          padding: 0 10px; }
          html #selected table td .inner .textIn {
            display: inline-block;
            line-height: 1.2;
            vertical-align: middle; }
  html .detail {
    display: none; }
  html #footer {
    width: 100%; }
    html #footer ul {
      display: none; }
  html #facebook,
  html #inquiry {
    display: none; }
  html #copyright {
    float: none;
    text-align: center;
    width: 100%;
    height: auto;
    text-indent: 0;
    overflow: auto;
    font-family: serif;
    background: none; } }