/* *********************************************************************************************************************
	One% CSS Grid - 12 Columns Fluid CSS Grid System

	Why One% ? Let’s count ...
		we have 12 columns (magic number divided by 2, 3, 4, 6)

		for 12 columns we need 11 margins

		so if we count margin 3%, then 3% * 11 margins = 33%

		and if we count width of 1 column 5.5%, than 5.5% * 12 columns = 66%

		in the end we have 33% + 66% = 99% aaand ???

		1% is still here so that's the name - One%

	2 starting options ? Let’s count a bit more ...
		1200px - perfectly fits 1280 screens
			12 columns
			margin 3% / 36px (full-width)
			col1 5.5% / 66px (full-width)

		1000px - perfectly fits 1024 screens
			12 columns
			margin 3% / 30px (full-width)
			col1 5.5% / 55px (full-width)
*/

/* *********************************************************************************************************************
 * Browser Default Initialization
 */
 body, div, dl, dt, dd, ul, ul li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, blockquote, th, td,
section, nav, article, aside, hgroup, header, address,
figure, figcaption {
	margin: 0;
	padding: 0;
	/*line-height: 160%;*/
}

/* *********************************************************************************************************************
 * body
 */
 body {
	/*font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;*/
    font-family: 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,"メイリオ",Meiryo,Osaka,'ＭＳ Ｐゴシック',MS PGothic,sans-serif;
	color: #333;
	font-size: 16px;
	/*line-height: 160%;*/
	text-align: left;
	letter-spacing: -0.001em;		/* iOS4でのテキストの隙間への対応 */
	-webkit-text-size-adjust: 100%;		/* 文字サイズの自動調整機能のキャンセル */
}
.win body {
	font-family: 'Noto Sans JP','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

a:visited {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

a:active {
	text-decoration: underline;
}
*{
	box-sizing: border-box;
}


/* *********************************************************************************************************************
 * Main container for all
 */

.container{
	width: 100%;
	max-width: 1220px;
	margin: 0 auto;
	padding: 0 0 0 1%; /* THAT'S THE NAME ;) */
}

.onerow {
	/*clear: both;*/
	padding: 0 10px;
	overflow: hidden;
}

#pc_header{
    display: block;
}

#sp_header{
    display: none;
}
	
/* フルードイメージ対応 */
img {
	max-width: 100%;
	height: auto;
}
.ie8 img {
	width: auto;
}

p {
	font-size: 16px;
	line-height:1.7;
}

.img {
	text-align: center;
	border:0;
}


/* ------ Header ------ */
header{
	margin:0;
	padding:8px;
    background-color:#fff;
    border-top: solid #0055A6 10px;
    width: 100%;
    position: fixed;
    z-index: 999;
    height: 68px;
    box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);
  -webkit-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);
}

h1 {
    font-size: 16px;
    /*font-size: 14px;*/
    padding: 5px 0 0 40px;
    
}

.nanojet_logo{
    /*background-color: aqua;*/
    width: 70%;
    margin: 0 auto;
    display: block;
}

/*.nanojet_logo img{
    width: 70%;
    margin: 0 auto;
    display: block;
}*/

/*.inner{
    display: table-cell;
    vertical-align: middle;
}*/

.header_right{
    float: right;
    overflow: hidden;
    padding-top: 3px;
}

.btn_header{
    float:left;
    width: 55%;
    /*background-color: aqua;*/
}

.btn_header li{
    /*display: inline;*/
    float: left;
    padding-right: 8px;
    width:50%;
    list-style: none;
}

.btn_header a {
    color: #fff;
    background-color: #0055A6;
    border-radius: 5px;
    border-color: #0055A6;
    padding: 5px 0;
    display: block;
    text-decoration: none;
    text-align: center;
    font-size: 14px;
}

.btn_header a:hover{
    background-color: #3F7BB9;
    border-radius: 5px;
    border-color: #3F7BB9;
}

.renraku{
    float: right;
    width:45%;
    /*background-color: brown;*/
}

/* 共通ボタン */
.btn_center{
    margin: 50px auto;
    width:350px;
    font-size: 24px;
}

.btn_center a {
    background-color: #2e71f2;
    color: #fff;
    border-radius: 2.5em;
    border-color: #2e71f2;
    padding: 5px 0;
    display: block;
    text-decoration: none;
    text-align: center;
}

.btn_center a:hover {
    background-color:#8baded;
    border-color: #8baded;
}

.btn_toiawase  {
    margin: 50px auto;
    width:350px;
    font-size: 40px;
}

.btn_toiawase a {
    color: #fff;
    background-color: #22ac38;
    border-radius: 10px;
    border-color: #22ac38;
    padding: 10px 0;
    display: block;
    text-decoration: none;
    text-align: center;
}

.btn_toiawase a:hover{
    background-color: #72c981;
    border-radius: 10px;
    border-color: #72c981;
}

/* ドロワーメニューの画像サイズ*/
.drawer-menu img{
    width:80%;
}

/*共通見出し*/
.bg_page_title{
    background-color: #EEE;
}


/* ------ footer ------ */
footer{
	width: 100%;
	background-color: #333333;
    overflow: hidden;
    color: #fff;
}
address{
	font-style: normal;
	font-size: 12px;
	line-height: 1.5;
	text-align:center;
	color: #fff;
    padding-bottom: 10px;
}

.footer_left{
    float: left;
    padding: 20px;
}

.footer_right{
    float: right;
    padding: 20px;
    text-align: right;
}
.sitemap ul{
    list-style-type: none;
    margin-bottom: 10px;
}
.sitemap li {
    font-size: 12px;
    line-height: 1.5;
    /*display: table-cell;*/
    display: inline;
    padding-right: 10px;
}

.sitemap li a{
	list-style: none;
	text-decoration: none;
	color:#fff;
}
.sitemap li a:hover{
	text-decoration: underline;
}
.sitemap p{
    font-size: 14px;
    line-height: 1.7;
}




	
/*タブレット対応*/
@media screen and (min-width: 600px) and (max-width: 959px) {
/* ------ Header ------ */

    #pc_header{
        display: none;
    }
    
    #sp_header{
        display:block;
    }
    
   .nanojet_logo {
        padding: 1% 10% 0 20%;
        text-align: center;
        float: left;
        width:95%;
    }

    .nanojet_logo img{
        width: 50%;
    }
    
    .sp_tel {
        width: 5%;
        float: right;
        font-size: 180%;
    }
    
    .sp_tel a{
        color: #0054A4;
    }

    /* 共通ボタン */
    .btn_center{
        margin: 30px auto;
    }


    .btn_toiawase  {
        margin: 30px auto;
        width: 300px;
        font-size: 150%;
    }


/* ------ footer ------ */
    address{
        font-size: 80%;
    }

    .footer_left{
        display: none;
    }

    .footer_right{
         float: none;
        width:100%;
        padding: 20px;
        text-align: center;
    }

}


/* ミニタブレット対応*/
@media screen and (max-width:736px) {
	
}

	



/*スマホ対応*/
@media screen and (max-width:599px) {
    header {
        padding: 8px 0 0 0;
        box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);
  -webkit-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);
    }
    
    #pc_header{
        display: none;
    }

    #sp_header{
        display: block;
        width: 100%;
        overflow: hidden;
        padding-right: 10px;
    }
    
    .nanojet_logo {
        padding: 1% 10% 0 20%;
        text-align: center;
        float: left;
        width:90%;
    }

    .nanojet_logo img{
        width: 100%;
    }
    
    .sp_tel {
        width: 10%;
        float: right;
        margin: 0;
        font-size: 180%;
        /*background-color: aqua;*/
    }
    .sp_tel a{
        color: #0054A4;
    }
    
    /* 共通ボタン */
    .btn_center{
        margin: 30px auto;
        width: 70%;
        font-size: 100%;
    }

    .btn_toiawase  {
        margin: 30px auto;
        width:70%;
        font-size: 120%;
    }
    
    /* ------ footer ------ */    
    .sitemap{
        display: none;
    }
    
    .footer_right {
        float: none;
        padding: 10px 20px 20px 20px;
        /*text-align: right;*/
        text-align: center;
    }

}


/*印刷用*/
@media print {
	
}





/* *********************************************************************************************************************
 * Common columns definitions
 */
.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
	float: left;
	margin: 0 3% 0 0;
}

 .col6-j {
	float: left;
	margin: 0;
}

.col1.last, .col2.last, .col3.last, .col4.last, .col5.last, .col6.last, .col7.last, .col8.last, .col9.last, .col10.last, .col11.last, .col12 {
	margin: 0;
}

.col1 { width: 5.5%; }
.col2 { width: 14%; }
.col3 { width: 22.5%; }
.col4 { width: 31%; }
.col5 { width: 39.5%; }
.col6 { width: 48%; }
.col6-j { width: 50%; }
.col7 { width: 56.5%; }
.col8 { width: 65%; }
.col9 { width: 73.5%; }
.col10 { width: 82%; }
.col11 { width: 90.5%; }
.col12 { width: 99%; margin: 0; }

/*.col1 img, .col2 img, .col3 img, .col4 img, .col5 img, .col6 img, .col7 img, .col8 img, .col9 img, .col10 img, .col11 img, .col12 img {
	width: 100%;
	height: auto;
	display: block;
}*/





/* *********************************************************************************************************************
 * Disable padding left/right 10px if I'm 1024 or gibber - correct percentage math
 */
@media all and (min-width: 1024px) {
	.onepcssgrid-1000 {
		max-width: 1000px;
	}

	.onepcssgrid-1000 .onerow {
		padding: 0;
	}
}





/* *********************************************************************************************************************
 * Small devices
 */
@media screen and (max-width: 599px) {
	.onerow {
	}

	.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11 {
		float: none;
		width: 99%;
	}
    .col6-j {
		float: none;
		width: 100%;
	}
}

/*@media all and (max-width: 768px) {
	.onerow {
	}

	.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11 {
		float: none;
		width: 99%;
	}
}
