@charset "utf-8";
/* CSS Document */

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

  はじめての方／beginner.html

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

/*-- navi ハイライト --*/
body#body-beginner #navi_in ul li.navi_beginner a {
  text-decoration: none;
  background-color: #72c7cb;
  color: #fff;

  background-image: url(../img/navi_beginner_.png);
}

/*-- KV 背景 --*/
body#body-beginner #page_kv {
  background-image: url(../img/page_kv_beginner.jpg);
}

/*-- コンテンツA --*/
body#body-beginner .content-a .content-box {
  max-width: 950px;
  margin-left: 0;
}
body#body-beginner .content-a .content-box .left {
  width : calc( 50% - 10px );
}
body#body-beginner .content-a .content-box .left img {
  width : 100%;
}
body#body-beginner .content-a .content-box .right {
  width : calc( 45% - 10px );
}

/*-- コンテンツA2 --*/
body#body-beginner .content-a2 .content-box {
  max-width: 950px;
  margin-left: 0;
}
body#body-beginner .content-a2 .content-box .left {
  width : calc( 45% - 10px );
}
body#body-beginner .content-a2 .content-box .right {
  width : calc( 50% - 10px );
}
body#body-beginner .content-a2 .content-box .right img {
  width : 100%;
}

/*-- コンテンツB --*/
body#body-beginner .content-b .content-box {
  max-width: 860px;
}
body#body-beginner .content-b .content-box .left {
  width : calc( 50% - 10px );
}
body#body-beginner .content-b .content-box .left img {
  width : 100%;
}
body#body-beginner .content-b .content-box .right {
  width : calc( 40% - 10px );
}
body#body-beginner .content-b p {
  margin-top: 20px;
}


/*-- コンテンツC --*/
body#body-beginner .content-c .content-box {
  max-width: 860px;
}

body#body-beginner .content-c .content-box .left {
  width : calc( 45% - 10px );
}
body#body-beginner .content-c .content-box .right {
  width : calc( 50% - 10px );
}
body#body-beginner .content-c .content-box .right img {
  width : 100%;
}

/*body#body-beginner .content-c .content-box .left {
  width : calc( 48% - 10px );
}
body#body-beginner .content-c .content-box .right {
  width : calc( 46% - 10px );
}
body#body-beginner .content-c p {
  margin-top: 10px;
}*/

body#body-beginner .content-c .content-box dl {
  font-size: 14px;
  border-top: 1px solid #f2f2f2;
}
body#body-beginner .content-c .content-box dt{
  color: #46bfc5;
  float: left;
  clear: left;
  width: 7em;
  padding: 14px 10px;
}

body#body-beginner .content-c .content-box dd{
  border-bottom: 1px solid #f2f2f2;
  padding-left: 7.5em; /* dtの幅以上のpaddingをとる*/
  padding: 14px 10px;
}


/*-- コンテンツD --*/
.biginner_flow {
  width: 100%;
  max-width: 800px;
  margin: 0 auto 40px auto;
}
.biginner_flow ul {
}
.biginner_flow ul li {
  width: calc( 90% / 5 );
  float: left;
  margin-right: 2%;
}
.biginner_flow ul li:nth-last-child(1) {
  margin-right: 0;
}
.biginner_flow ul li h3 {
  text-indent: -9999px;
  width: 100%;
  height: 160px;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  margin-bottom: 10px;
}
.biginner_flow ul li p {
  font-size: 15px;
  line-height: 1.8em;
  font-family: 'Noto Sans JP', sans-serif;
　text-indent: 0;
	
}
.biginner_flow ul li p.pi {
	text-indent: 0 !important;
}
.biginner_flow_1 h3 {
  background-image: url("../img/biginner_step_1.png");
}
.biginner_flow_2 h3 {
  background-image: url("../img/biginner_step_2.png");
}
.biginner_flow_3 h3 {
  background-image: url("../img/biginner_step_3.png");
}
.biginner_flow_4 h3 {
  background-image: url("../img/biginner_step_4.png");
}
.biginner_flow_5 h3 {
  background-image: url("../img/biginner_step_5.png");
}

.bgflow_notis {
	font-size: 0.9em;
	color: #666;
	font-family: 'Noto Sans JP', sans-serif;
	margin-top: 2em;
}


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

SP　スマホ
画面サイズが765px以下　

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

@media screen and (max-width:765px) { 

  
/*-- コンテンツB --*/
body#body-beginner .content-b .content-box .right img {
  width: 80%;
  margin: 10px auto;
  display: block;
}

  
/*-- コンテンツC --*/
body#body-beginner .content-c .content-box dt{
  color: #46bfc5;
  float: none;
  /*clear: left;*/
  width: auto;
  padding: 10px 10px 0;
}

body#body-beginner .content-c .content-box dd{
  border-bottom: 1px solid #f2f2f2;
  padding-left: 0; /* dtの幅以上のpaddingをとる*/
  padding: 5px 10px 10px;
}
  
/*-- コンテンツD --*/

.biginner_flow ul {
    display: flex;
    flex-wrap: wrap;
}
.biginner_flow ul li {
  width: calc( 90% / 2 );
  float: left;
  margin-right: 5%;
  margin-bottom: 20px;
}

	
}