@charset "Shift_JIS";
/*===========================================
	support/tv/rec/usbhdd2015_2/  2023/02
=============================================*/

#mainCntArea h1.title {
    border-bottom: 2px solid #6b6b6b;
    color: #2f353d;
    margin-bottom: 1em;
	font-size: 1.5rem;
}

#mainCntArea h1.title span {
	font-size: 1.2rem;
}

#mainCntArea h2.st_bar {
	margin-top:2em;
	padding:7px 10px;
	background:#000000;
	color:#FFF;
	border-left:#AB1E23 5px solid;
	font-size: 1.1538461538462rem;
}

#mainCntArea h3.step {
	margin-top:1.5em;
	padding-bottom:5px;
	font-size:1.3846153846154rem;
	font-weight:bold;
	border-bottom:#666 1px solid;
}

#mainCntArea h3.st-bar {
    border-bottom: 2px solid #AB1E23;
	margin: 30px 0px 0px 0px;
	padding: 0px 10px 3px 0px;
	clear:both;
	font-size:18px;
	font-weight:bold;
}

#mainCntArea .fltRight {
    float: right;
}

/*braviaArea*/
#mainCntArea div.braviaArea {
	margin: 1em 0 2em;
	padding: 0px;
	border: solid 1px #AB1E23;
}

#mainCntArea div.braviaArea p.bold {
	padding: 0.5em 1em;
	background: #AB1E23;
	color: #FFF;
	font-weight: bold;
}

#mainCntArea div.braviaArea div.braviaBox {
	margin: 1em;
}

#mainCntArea div.braviaArea div.braviaBox p{
	font-weight: bold;
}

/*bymaker*/
#mainCntArea div.bymaker {
	margin: 0 0 2em;
	padding: 0px;
	border: solid 1px #0070C0;
}

#mainCntArea div.bymaker p.bold {
	padding: 0.5em 1em;
	background: #0070C0;
	color: #FFF;
	font-weight: bold;
}

#mainCntArea div.bymaker ul {
	margin: 1em;
	list-style: none;
	display: flex;
    justify-content: flex-start;
    gap: 1em;
}

#mainCntArea div.bymaker ul li {
	width: 170px;
}

#mainCntArea div.bymaker ul li a{
	background: url(/support/share/images/bg_mod-linkButton.jpg) repeat-x scroll left center;
    border: solid 1px #CCCCCC;
    border-radius: 5px;
    color: #333;
    padding: 1em 0 0.75em 0.5em;
    display: block;
}

#mainCntArea div.bymaker ul li :hover,
#mainCntArea div.bymaker ul li :focus {
    opacity: 0.6;
	text-decoration: none;
}


#mainCntArea div.bymaker p.font12 {
	margin: 0 1em 1em;
	font-size: 0.93rem;
}

/* btnList */
#mainCntArea .btnList {
	margin: 0 0 3em;
}

#mainCntArea .btnList ul {
	list-style: none;
	margin-left: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#mainCntArea .btnList ul:after {
    content: '';
    display: none;
}

#mainCntArea .btnList ul li{
	width: 49.2%;
	margin-bottom: 10px;
}

#mainCntArea .btnList ul li a {
    background: url(/support/share/images/bg_mod-linkButton.jpg) repeat-x scroll left center;
    border: solid 1px #CCCCCC;
    border-radius: 5px;
    color: #333;
    padding: 1em 0 0.75em 0.75em;
    display: block;
}

#mainCntArea .btnList ul li.inner a span.txtlink {
    background: url(/support/share/images/arrow_underline.gif) no-repeat 0 0.5em;
    padding-left: 1em;
    display: inline-block;
}

#mainCntArea .btnList ul li a:hover,
#mainCntArea .btnList ul li a:focus {
    opacity: 0.6;
	text-decoration: none;
}

/* linkBtn */
#mainCntArea .linkBtn a {
    display: block;
    background: url(/support/share/images/bg_mod-linkButton.jpg) repeat-x scroll left center;
    border: solid 1px #CCCCCC;
    border-radius: 5px;
    padding: 1em 0 0.75em 0.75em;
	margin: 2em 0 1em;
    width: 60%;
    text-decoration: none;
    color: #333;
    box-sizing: border-box;
}

#mainCntArea .linkBtn a:hover,
#mainCntArea .linkBtn a:focus {
    opacity: 0.6;
}

#mainCntArea .icon_window{
	padding-left: 0.3em;
}

@media (max-width: 640px) {
	#mainCntArea div.bymaker ul,
	#mainCntArea .btnList ul{
		flex-direction: column;
	}
	
	#mainCntArea div.bymaker ul {
		gap: 0;
	}
	
	#mainCntArea div.bymaker ul li{
		margin-bottom: 0.7em;
	}
	
	#mainCntArea div.bymaker ul li,
	#mainCntArea .btnList ul li,
	#mainCntArea .linkBtn a{
		width: 100%;
	}
}

/* 20250326 左ナビ削除後*/
@media (min-width: 641px) {
	#mainCntArea.section div.contentsArea{
		width: auto;
		padding: 0 2em;
	}
	#mainCntArea div.bymaker ul li{
		width: calc(25% - 10px);
	}
	
	#mainCntArea ul.stepArea-top li.txt, ul.stepArea li.txt{
		width: calc(100% - (320px + 2em));
		margin-left: 1em;
	}
}

.share4-breadcrumbs{
	word-break: break-all;
}

@media (max-width: 640px) {
	#mainCntArea div.warningArea img:not(.icon){
		display: block;
		margin: 10px auto 0;
	}
}