/*----------------------------------------------------------------------------------------------------------------------------------- 
 Base
-----------------------------------------------------------------------------------------------------------------------------------*/
body {
	text-align: center;
}

.content-asset h1,
.content-asset h2,
.content-asset h3,
.content-asset h4,
.content-asset h5,
.content-asset h6,
.content-asset p,
.content-asset ul,
.content-asset ol,
.content-asset li,
.content-asset dl,
.content-asset dt,
.content-asset dd,
.content-asset th,
.content-asset td
{
	margin: 0;
	padding: 0;
	list-style: none;
	color: #555555;
	line-height: 1.4;
}

#pageContents {
	font-family: "ＭＳ Ｐゴシック", sans-serif;
	font-size: 12.2px;
	max-width:96vw;
	width: 720px;
	margin: auto;
	font-size: 12.2px;
	text-align: left;
}

.pageTtl {
	margin-bottom: 20px;
}

.clearfix, .flWrap, .boxWrap, #hdr, #columnWrap, #gnav, #ftrList,
	.ftrWrap, .orderBg, .serviceBg {
	display: inline-block;
	zoom: 1;
}

.pdT20 {
	padding-top: 20px;
}

.both {
	clear: both;
}

/*Other
-------------------------------------------------------------*/
/*Link
--------------*/
a {
	color: #666666;
	outline: none;
}

a:link {
	text-decoration: none;
}

a:visited {
	color: #666666;
	text-decoration: none;
}

a:hover {
	color: #666666;
	text-decoration: underline;
}

a:active {
	color: #666666;
}

#ftrLink a:hover {
	text-decoration: none;
}

.icnArw {
	background: url(../images/hajimete/icn_arw_01.gif) no-repeat left;
	padding-left: 12px;
}

#main .breadcrumbs {

	padding-left: 0;
	text-align: left;
}

/*Title
--------------*/
#ttlField {
	height: 38px;
	border-bottom: 6px solid rgb(221, 221, 221);
	display: inline-block !important;
	width: 100%;
}

#ttlField p {
	font-family: Arial, Helvetica, sans-serif;
	line-height: 31px;
	width: 50%;
	margin-bottom: 5px;
	float: left;
	font-size: 22px;
	font-weight: bold;
	display: block;
	margin-bottom: 5px;
	width: 50%;
}

#ttlField ul {
	text-align: right;
	width: 50%;
	float: right;
}

#ttlField ul li {
	float: right;
}

#ttlField ul li img {
	width: 95%;
}


/*order
-------------------------------------------------------------*/
.order {
	width: 100%;
	clear: both;
	background-color: rgb(255, 242, 225);
	border: 1px solid rgb(181, 181, 181);
	border-radius: 2px;
}

.orderBg {
	margin: 0;
}

.orderList li {

	background: url(../images/hajimete/icn_arw_01.gif) no-repeat left;
	no-repeat left 3px;
	padding-left: 12px;
}

.order {
	margin-bottom: 20px;
	text-align: center;
}

.order .orderBg {
	padding: 25px 0 17px 0;
}

.order .orderList {
	float: left;
	margin-right: 50px;
	margin-top: 3px;
}

.order .orderBtn {
	float: right;
}


/*----------------------------------------------------------------------------------------------------------------------------------- 
 Mobie
-----------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
	#pageContents {
		max-width: 93vw;
		margin: auto;
	}
}


@media only screen and (max-width: 390px) {
	#ttlField {
		height: auto;
	}
	#ttlField p {
		width: 100%;
		margin-bottom: 0;
		line-height: 23px;
		font-size: 18px;
	}	
	#ttlField ul {
		width: 100%;
		margin-top: 0;
		float: left;
		text-align: left;
	}
	#ttlField ul li {
		float: left;
	}
	.boxWrap .flL {
		width: 100%;
	}
	.boxWrap .flR {
		width: 100%;
		text-align: center;
	}
	.boxTtl {
		width: auto;
	}
	.order .orderList {
		margin-right: 10px;
	}

	.flL, .boxL {
		margin-bottom: 10px;
	}
	.flR, .boxR {
		margin: auto;
		float: none;
	}
	
}

@media only screen and (max-width: 325px) {
	.order .orderList {
		float: none;
		text-align: center;
		margin-bottom: 5px;
	}
	.order .orderBtn {
		float: none;
		text-align: center
	}
}

@media only screen and (max-width: 260px) {
	.boxTtl img {
		width: 100%;
	}
	.order img {
		width: 100%;
	}
}
#pageContents {
    font-family: "ＭＳ Ｐゴシック", sans-serif;
    font-size: 12.2px;
    max-width: 96vw;
    width: 720px;
    margin: auto;
    font-size: 12.2px !important;
    text-align: left;
}
.pageTtl{
	width:100%;
	height:auto;
}

.secTtl {
    margin-top: 15px;
    margin-bottom: 15px;
}

.secTtl, .secTtl > img, .pageSection, img {
    max-width: 100%;
    height:auto;
}


.box1-1{
	width:31.8%;
	float:left;
}
.box1-2{
	width:68.2%;
	float:right;
}
.txaC{
	width:44.44%;
	margin:auto;
	
}
.box1 > .txt{
	width:82%;
	margin:auto;
	padding:10px;
}
.imgList{
	width:100%;
	height:auto;
}
#imgList > .imgList > li > img{
	width:19.5%;
}
#imgList{
	margin-bottom:10px;
}
.imgList > li{
	display:inline;
}
* {
  box-sizing: border-box;
}
.noteArea {
	width:100%;
	display:flex;
}
.img-contain {
  float:left;
  width:22%;
}

.table-contain {
	margin-left:auto;
  float:right !important;
  width:77%;
  margin-botton:15px;
}
.noteTtl {
    font-weight: bold;
    margin-bottom: 5px;
}
.note li {
    text-indent: -1em;
    margin-left: 1em;
}
.noteInner {
    height: 110px;
    border: solid 1px #cccccc;
    padding: 8px;
    overflow: auto;
}
.mgB10 {
    margin-bottom: 10px;
}
.noteArea{
	display:flex !important;
	margin-bottom:15px;
}
.mgT5 {
    margin-top: 5px;
}
.txtS, #hdr .hdrLink li, #ftrLink li, .topBack {
    font-size: 85%;
    line-height: 1.4;
}
.noteSec {
    margin-bottom: 10px;
}
.note {
    margin-bottom: 10px;
}
@media only screen and (max-width: 375px) {
	#pageContents{
		font-size:10px !important;
	}
}

@media only screen and (max-width:768px) {
  /* For mobile phones: */
  .secTtl > img{
  	min-height:25px;
  }

  .box1-1{
	width:40%;
	float:left;
	}
  .box1-2{
	width:60%;
	float:right;
  }
}
@media only screen and (max-width:400px) {
  #imgList > .imgList > li > img{
	width:18.7% !important;
	}
}
@media only screen and (min-width:401px) and (max-width:640px) {
  #imgList > .imgList > li > img{
	width:19.2% !important;
	}
}