@charset "Shift_JIS";


/************************************************
 共通設定
************************************************ */
body {
    font-family: Meiryo,Verdana,Arial,Helvetica,sans-serif;
    font-size: 14px;
    line-height: 150%;
	min-width:1024px;

	margin: 0px;
}

.frame_outer{
	margin: 8px auto 0px auto;
	width: 100%;
	text-align: center;
}

/* ヘッダー
----------------------------------------------- */

#header{
	width: 1024px;
	height:90px;
	margin: 50px auto 0 auto ;
}

#title{
	height:94px;
	text-align: left;
}

h1{
	margin: -15px 25px 10px 0px;
}

#logo {
	margin-left:40px;
}

#logo img{
	width: 200px;
}


.header-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 10px;
}

.header-nav a {
    text-align: center;
    font-size: 14px;
    color:#475662;
    text-decoration: none;
    line-height: 1.2;
}

.header-nav a:hover {
	text-decoration: underline;
}

.nav-text01{
    font-size: 17px;

}
.nav-text02{
    font-size: 12px;

}

.li-w01{
	width:80px;

}
.li-w02{
	width:110px;

}
.li-w03{
	width:130px;

}
.li-w04{
	width:100px;

}

.nav-border-l{
	color: #475662;
	border-left: 1px solid #475662;
}
.nav-border-r{
	color: #475662;
	border-right: 1px solid #475662;
}

/* メイン部分
----------------------------------------------- */
#main{
	width: 100%;
	margin: 0px auto;

	font-size: 120%;

}

h2{
	height:34px;
	width: 900px;

	margin: 55px auto 0px auto;
	padding-left: 10px;

	font-size: 30px;
	font-weight: 400;

}

h3 {
	margin: 5px auto 10px auto;
	padding-top: 20px;
	padding-left: 10px;

    font-size: 24px;
	font-weight: 400;
	line-height: 100%;
}

h4 {
	height:34px;
	width: 880px;

	margin: 5px auto 10px auto;
	padding-top: 20px;

    font-size: 24px;
	font-weight: 400;

}

.border_about{
	color: #f09c18;
	border-bottom: 2px solid #f09c18;
}
.border_greeting{
	color: #28c8c8;
	border-bottom: 2px solid #28c8c8;
}
.border_order{
	color: #f29595;
	border-bottom: 2px solid #f29595;
}
.border_paperbag{
	color: #8dc661;
	border-bottom: 2px solid #8dc661;
}
.border_making{
	color: #1d95cc;
	/*border-bottom: 2px solid #1d95cc;*/
}

.border_envelopeform{
	color: #00a89f;
	border-bottom: 2px solid #00a89f;
}

.border_envelopesize{
	color: #00af80;
	border-bottom: 2px solid #00af80;
}

.border_contact{
	color: #8b84b7;
	border-bottom: 2px solid #8b84b7;
}

/* TOPページ
----------------------------------------------- */

#top{
	width: 1024px;

	background-color: white;
	margin: 0px auto;

}

#top_img img{
	width: 900px;
}

#top_text{
	margin: 30px auto;

	line-height: 200%;
	letter-spacing: 1px;
}

#top_navigation{
	margin: 80px auto;
}

#top_navigation a{
	margin: 0px 15px;
}
#top_navigation img{
	width: 235px;
}


.contents_body{
	width: 900px;
	margin: 50px auto 70px auto;
	overflow: hidden;
	color: #4D5862;
}

.contents_title{
	width: 135px;

}

.contents_title h3{
	width: 130px;
}

.contents_text{
	width: 700px;
	height:100%;

	color: #475662;
	border-left: 1px solid #475662;

	padding-left: 50px;

	line-height: 2.0;
}

/* 社長挨拶
----------------------------------------------- */
.greeting_img{
	margin: 30px auto -230px auto;
	width: 570px;
}

.greeting_img img{
	width: 160px;
	margin: 0px auto;
}

#greeting_info{

}
#greeting_text{
	width: 700px;
    line-height: 160%;
	margin: 10px auto 20px auto;

	letter-spacing: 1px;
	overflow: hidden;

}

/* 会社概要
----------------------------------------------- */
#outline table{
	width: 570px;
	padding-left: 10px;
	line-height: 1;
}

#outline th{
	width: 190px;
	font-weight: normal;
}

#outline td{
	width: 370px;
	padding-bottom: 2px;

	line-height: 160%;
	letter-spacing: 1px;
}

#history table{
	width:700px;
	padding-left: 10px;
	line-height: 1;
}

#history th{
	width: 180px;
	font-weight: normal;
	padding-top: 5px;
}

#history td{
	width: 650px;
	padding-bottom: 2px;

	line-height: 160%;
	letter-spacing: 1px;
}

.hinmoku{
	width: 700px;

	margin: 0px auto;
	line-height: 1;
}
.hinmoku ul{
	list-style-type: none;
	padding-left: 0px;
}
.hinmoku li{
	padding-bottom: 5px;
}

/* お問い合わせ
----------------------------------------------- */
#contact_info{
	font-size: 160%;
    line-height: 100%;

}

.img_href a:hover{
	text-decoration: underline;

	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}

/* ご注文の流れ
----------------------------------------------- */

#order_flow{
	min-height:850px;

	background-color: white;
	margin: 0px auto;
}

#order_flow table{
	width: 700px;

	margin: 25px auto 0px auto;
}

#order_flow th{
	width: 190px;

	text-align: center;
	vertical-align:top;
}

#order_flow td{
	width: 600px;
	padding-left: 20px;
	padding-top: 7px;
	padding-bottom: 50px;

	vertical-align:top;

	line-height: 160%;
	letter-spacing: 1px;
}


.making_link img{
	vertical-align: middle; 
	padding-left:10px;
}

#order_flow a:hover{
	text-decoration: underline;

	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}

/* 紙袋のサイズについてページ
----------------------------------------------- */
#envelope_size{
	width: 755px;

	background-color: white;
	margin: 0px auto;

	padding-bottom: 50px;
}


.size_title{
	width: 755px;
	margin: 20px auto 0px auto;

}

.attention{
	width: 650px;
	margin: 10px auto 0px auto;

	font-size: 12px;

}


/* 紙袋の形態についてページ
----------------------------------------------- */
.envelopeform_body{

	width: 755px;
	margin: 20px auto 0px auto;
}
.explain_body{
	width: 755px;
	margin: 20px auto 0px auto;
}

.explain_body img{
	padding-bottom: 30px;
}


/* 紙袋ができるまでページ
----------------------------------------------- */
#making{
	width: 700px;
	min-height:950px;

	background-color: white;
	margin: 0px auto;

	padding-bottom: 50px;
}

#making h3{
	width: 880px;
	color:#1d95cc;
	font-size: 24px;
}

.making_tilte{
	width: 880px;
	text-align: left;

	margin: 10px auto 0px auto;
	padding-left: 10px;
}

#making table{
	width: 700px;

	margin: 10px auto 30px auto;
}

#making th{
	width: 200px;
	padding-top:20px;
	text-align: center;
}

#making td{
	width: 480px;
	padding-left: 20px;

	line-height: 160%;
	letter-spacing: 1px;

	text-align: left;
}

#making p{
	margin: 5px 0px 0px 0px;
}

#making ul{
	margin: 15px 0px 0px 0px;
}
#making li{

}

#making a:hover{
	text-decoration: underline;

	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}

/* フッター
----------------------------------------------- */
.spacer10{
	height: 10px;
}
.spacer20{
	height: 20px;
}
.spacer30{
	height: 30px;
}

#page_back{
	float:right;
	margin: 0px 30px 5px 0px; ;
}

#page_back input:hover{
	text-decoration: underline;

	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}

#page_back input:focus {
	outline:0;
}


#footer{
	width: 100%;
	margin: 0px auto;

	background-color: #4D5862;

}

#footer_info{
	width: 500px;

	margin: 0px auto;

	color:#ffffff;

}

#footer_logo{
	width: 100px;

	margin: 10px auto;

	float:left;
}
#footer_text{
	width: 400px;
}


#footer_info ul{
	width: 400px;

	margin: 0px;

	list-style-type: none;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .header {
        flex-direction: column;
    }
    .header-nav ul {
        flex-wrap: wrap;
        justify-content: center;
    }
    .profile-section {
        grid-template-columns: 1fr;
    }
    .ceo-photo {
        float: none;
        margin: 0 auto 10px;
    }
}